-
Notifications
You must be signed in to change notification settings - Fork 6
/
Copy pathch04_encoding.html
27 lines (26 loc) · 36.9 KB
/
ch04_encoding.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<!DOCTYPE html>
<html lang="en-US" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>编码 | 编程导引</title>
<meta name="description" content="A VitePress site">
<link rel="preload stylesheet" href="/assets/style.c68003ee.css" as="style">
<script type="module" src="/assets/app.ef6b4c6d.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.41379913.js">
<link rel="modulepreload" href="/assets/chunks/theme.0fe641a0.js">
<link rel="modulepreload" href="/assets/ch04_encoding.md.6d49b0e8.lean.js">
<script>var _hmt=_hmt||[];(function(){var e=document.createElement("script");e.src="https://hm.baidu.com/hm.js?c522f795b036ecc6e5446ce20e40ae9f";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})();</script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.6.0/katex.min.css">
<script id="check-dark-light">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
</head>
<body>
<div id="app"><div class="Layout" data-v-b2cf3e0b><!--[--><!--]--><!--[--><span tabindex="-1" data-v-c8616af1></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-c8616af1> Skip to content </a><!--]--><!----><header class="VPNav" data-v-b2cf3e0b data-v-7e5bc4a5><div class="VPNavBar has-sidebar" data-v-7e5bc4a5 data-v-94c81dcc><div class="container" data-v-94c81dcc><div class="title" data-v-94c81dcc><div class="VPNavBarTitle has-sidebar" data-v-94c81dcc data-v-f4ef19a3><a class="title" href="/" data-v-f4ef19a3><!--[--><!--]--><!----><!--[-->编程导引<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-94c81dcc><div class="curtain" data-v-94c81dcc></div><div class="content-body" data-v-94c81dcc><!--[--><!--]--><div class="VPNavBarSearch search" style="--vp-meta-key:'Meta';" data-v-94c81dcc><!----></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-94c81dcc data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/intro.html" tabindex="0" data-v-7f418b0f data-v-37adc828 data-v-8f4dc553><!--[-->编程导引<!--]--><!----></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-94c81dcc data-v-f6a63727><label title="toggle dark mode" data-v-f6a63727 data-v-a9c8afb8><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" aria-checked="false" data-v-a9c8afb8 data-v-f3c41672><span class="check" data-v-f3c41672><span class="icon" data-v-f3c41672><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-a9c8afb8><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-a9c8afb8><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></label></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-94c81dcc data-v-40855f84 data-v-764effdf><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-764effdf><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-764effdf><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-764effdf><div class="VPMenu" data-v-764effdf 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><label title="toggle dark mode" data-v-40855f84 data-v-a9c8afb8><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" aria-checked="false" data-v-a9c8afb8 data-v-f3c41672><span class="check" data-v-f3c41672><span class="icon" data-v-f3c41672><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-a9c8afb8><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-a9c8afb8><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></label></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-94c81dcc 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" data-v-b2cf3e0b data-v-f5a2ca58><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-f5a2ca58><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-f5a2ca58><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-f5a2ca58>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-f5a2ca58 data-v-079b16a8><button data-v-079b16a8>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-b2cf3e0b data-v-af16598e><div class="curtain" data-v-af16598e></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-af16598e><span class="visually-hidden" id="sidebar-aria-label" data-v-af16598e> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-af16598e><section class="VPSidebarItem level-0 has-active" data-v-af16598e data-v-c4656e6d><!----><div class="items" data-v-c4656e6d><!--[--><div class="VPSidebarItem level-1 is-link" data-v-c4656e6d data-v-c4656e6d><div class="item" data-v-c4656e6d><div class="indicator" data-v-c4656e6d></div><a class="VPLink link link" href="/intro.html" data-v-c4656e6d data-v-8f4dc553><!--[--><p class="text" data-v-c4656e6d>引言</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-c4656e6d data-v-c4656e6d><div class="item" data-v-c4656e6d><div class="indicator" data-v-c4656e6d></div><a class="VPLink link link" href="/ch01_environment.html" data-v-c4656e6d data-v-8f4dc553><!--[--><p class="text" data-v-c4656e6d>环境</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-c4656e6d data-v-c4656e6d><div class="item" data-v-c4656e6d><div class="indicator" data-v-c4656e6d></div><a class="VPLink link link" href="/ch02_computation.html" data-v-c4656e6d data-v-8f4dc553><!--[--><p class="text" data-v-c4656e6d>计算</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-c4656e6d data-v-c4656e6d><div class="item" data-v-c4656e6d><div class="indicator" data-v-c4656e6d></div><a class="VPLink link link" href="/ch03_procedure.html" data-v-c4656e6d data-v-8f4dc553><!--[--><p class="text" data-v-c4656e6d>过程</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link is-active has-active" data-v-c4656e6d data-v-c4656e6d><div class="item" data-v-c4656e6d><div class="indicator" data-v-c4656e6d></div><a class="VPLink link link" href="/ch04_encoding.html" data-v-c4656e6d data-v-8f4dc553><!--[--><p class="text" data-v-c4656e6d>编码</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-c4656e6d data-v-c4656e6d><div class="item" data-v-c4656e6d><div class="indicator" data-v-c4656e6d></div><a class="VPLink link link" href="/ch05_sequence.html" data-v-c4656e6d data-v-8f4dc553><!--[--><p class="text" data-v-c4656e6d>序列</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-c4656e6d data-v-c4656e6d><div class="item" data-v-c4656e6d><div class="indicator" data-v-c4656e6d></div><a class="VPLink link link" href="/ch06_data.html" data-v-c4656e6d data-v-8f4dc553><!--[--><p class="text" data-v-c4656e6d>数据</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-c4656e6d data-v-c4656e6d><div class="item" data-v-c4656e6d><div class="indicator" data-v-c4656e6d></div><a class="VPLink link link" href="/ch07_state.html" data-v-c4656e6d data-v-8f4dc553><!--[--><p class="text" data-v-c4656e6d>状态</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-c4656e6d data-v-c4656e6d><div class="item" data-v-c4656e6d><div class="indicator" data-v-c4656e6d></div><a class="VPLink link link" href="/ch08_reference.html" data-v-c4656e6d data-v-8f4dc553><!--[--><p class="text" data-v-c4656e6d>引用</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-c4656e6d data-v-c4656e6d><div class="item" data-v-c4656e6d><div class="indicator" data-v-c4656e6d></div><a class="VPLink link link" href="/ch09_closure.html" data-v-c4656e6d data-v-8f4dc553><!--[--><p class="text" data-v-c4656e6d>闭包</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-c4656e6d data-v-c4656e6d><div class="item" data-v-c4656e6d><div class="indicator" data-v-c4656e6d></div><a class="VPLink link link" href="/ch10_object.html" data-v-c4656e6d data-v-8f4dc553><!--[--><p class="text" data-v-c4656e6d>对象</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-c4656e6d data-v-c4656e6d><div class="item" data-v-c4656e6d><div class="indicator" data-v-c4656e6d></div><a class="VPLink link link" href="/ch11_concurrency.html" data-v-c4656e6d data-v-8f4dc553><!--[--><p class="text" data-v-c4656e6d>并发</p><!--]--><!----></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-b2cf3e0b data-v-a494bd1d><div class="VPDoc has-sidebar has-aside" data-v-a494bd1d data-v-c4b0d3cf><!--[--><!--]--><div class="container" data-v-c4b0d3cf><div class="aside" data-v-c4b0d3cf><div class="aside-curtain" data-v-c4b0d3cf></div><div class="aside-container" data-v-c4b0d3cf><div class="aside-content" data-v-c4b0d3cf><div class="VPDocAside" data-v-c4b0d3cf data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" data-v-3f215769 data-v-ff0f39c8><div class="content" data-v-ff0f39c8><div class="outline-marker" data-v-ff0f39c8></div><div class="outline-title" data-v-ff0f39c8>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-ff0f39c8><span class="visually-hidden" id="doc-outline-aria-label" data-v-ff0f39c8> Table of Contents for current page </span><ul class="root" data-v-ff0f39c8 data-v-9a431c33><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-c4b0d3cf><div class="content-container" data-v-c4b0d3cf><!--[--><!--]--><!----><main class="main" data-v-c4b0d3cf><div style="position:relative;" class="vp-doc _ch04_encoding" data-v-c4b0d3cf><div><h1 id="编码" tabindex="-1">编码 <a class="header-anchor" href="#编码" aria-label="Permalink to "编码""></a></h1><p>这里的编码（Encoding）当然不是指简单的编写代码。</p><p>为什么会有这个概念呢。</p><p>想想古老的印度人是怎么表示数字的吧：用十个不同的符号和位序组合来表示一个确切的数字，演化成今天我们的用阿拉伯数字（Arabic Numerials）表示的十进制系统。</p><p>没错就是你身边到处都存在的<strong>数字</strong>。这套系统只需要简单的十个符号和并不怎么复杂的规则就能从0表示到任意大的确切数字。</p><p>我们在第二讲中提到，代码中的表示的“整数”，跟数学意义上的整数，是有所差距的。这个差距其宗之一就在于表示数字的能力上。</p><p>比如，我们来计算<span class="katex"><span class="katex-mathml"><!----></span><span class="katex-html" aria-hidden="true"><span class="strut" style="height:0.8141079999999999em;"></span><span class="strut bottom" style="height:0.8141079999999999em;vertical-align:0em;"></span><span class="base textstyle uncramped"><span class="mord"><span class="mord mathrm">2</span><span class="vlist"><span style="top:-0.363em;margin-right:0.05em;"><span class="fontsize-ensurer reset-size5 size5"><span style="font-size:0em;"></span></span><span class="reset-textstyle scriptstyle uncramped"><span class="mord scriptstyle uncramped"><span class="mord mathrm">7</span><span class="mord mathrm">0</span></span></span></span><span class="baseline-fix"><span class="fontsize-ensurer reset-size5 size5"><span style="font-size:0em;"></span></span></span></span></span></span></span></span>：</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#82AAFF;">pow</span><span style="color:#A6ACCD;">(</span><span style="color:#F78C6C;">2</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#F78C6C;">70</span><span style="color:#A6ACCD;">)</span><span style="color:#89DDFF;">;</span></span></code></pre></div><p>嗯，结果是什么鬼（<code>1.1805916207174113e+21</code>，特别是后面这段）！</p><p>也就是说，我们能直观表示的整数也就21位（十万亿亿级），再之后就只能用科学计数法表示了。</p><p>实际你会发现，其实还没到这个数量级的时候，数字就已经无法精确表示了。</p><p>为什么会这样呢？</p><h2 id="二进制" tabindex="-1">二进制 <a class="header-anchor" href="#二进制" aria-label="Permalink to "二进制""></a></h2><p>跟阿拉伯数字系统一样，计算机内部也是利用位序来表示数值，但犹豫数字电路只有通和断两种状态，所以，相当于每位上只能有两种状态，作为传统，我们将用0和1来表示这两种状态。</p><p>然后我们就会看到计算机努力的表示数字： <span class="katex"><span class="katex-mathml"><!----></span><span class="katex-html" aria-hidden="true"><span class="strut" style="height:0.64444em;"></span><span class="strut bottom" style="height:0.8388800000000001em;vertical-align:-0.19444em;"></span><span class="base textstyle uncramped"><span class="mord mathrm">0</span><span class="mpunct">,</span><span class="mord mathrm">1</span><span class="mpunct">,</span><span class="mord mathrm">1</span><span class="mord mathrm">0</span><span class="mpunct">,</span><span class="mord mathrm">1</span><span class="mord mathrm">1</span><span class="mpunct">,</span><span class="mord mathrm">1</span><span class="mord mathrm">0</span><span class="mord mathrm">0</span><span class="mpunct">,</span><span class="mord mathrm">1</span><span class="mord mathrm">0</span><span class="mord mathrm">1</span><span class="mpunct">,</span><span class="mord mathrm">1</span><span class="mord mathrm">1</span><span class="mord mathrm">0</span><span class="mpunct">,</span><span class="mord mathrm">1</span><span class="mord mathrm">1</span><span class="mord mathrm">1</span><span class="mpunct">,</span><span class="mord mathrm">1</span><span class="mord mathrm">0</span><span class="mord mathrm">0</span><span class="mord mathrm">0</span><span class="mpunct">,</span><span class="mord mathrm">1</span><span class="mord mathrm">0</span><span class="mord mathrm">0</span><span class="mord mathrm">1</span><span class="mpunct">,</span><span class="mord mathrm">1</span><span class="mord mathrm">0</span><span class="mord mathrm">1</span><span class="mord mathrm">0</span></span></span></span> 等你都觉得脑袋大了，计算机才数到10，不过其实关于这个问题并不需要你操心太多，反正跟阿拉伯数字一样，只要足够长，任意大的数都可以表示。</p><p>可是我们之前使用的过程告诉我们，其实并不是这样的。为什么呢？</p><h3 id="定长" tabindex="-1">定长 <a class="header-anchor" href="#定长" aria-label="Permalink to "定长""></a></h3><p>既然计算机表示数字就是靠0和1，那么如果我要表示多个数字，怎么来区分呢？</p><p>比如，你知道下面究竟是1，2，3，4还是13, 14？</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#F78C6C;">11011100</span></span></code></pre></div><p>于是其实我们可以思考一下，出了数值，还有什么可以利用的。</p><p>长度。（以及其实你也可以用霍夫曼编码。）</p><p>当我规定用于表示数据的长度必须是一定（比如4位）的时候，表示数据就特别地清晰了：</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#F78C6C;">0001</span><span style="color:#A6ACCD;"> </span><span style="color:#F78C6C;">0010</span><span style="color:#A6ACCD;"> </span><span style="color:#F78C6C;">0011</span><span style="color:#A6ACCD;"> </span><span style="color:#F78C6C;">0100</span></span></code></pre></div><p>就可以表示1，2，3，4这四个数。而上面那个我们理解不了的序列，也可以解释成13，14这两个数。</p><p>当你去规定一种解释二进制序列的方法的时候，其实你就是在定义一种<strong>编码</strong>。</p><p>二进制序列中，每个0或者1，叫一个bit（位），特定长度（一般是8）的基本解释单位，叫做byte（字节），这个特定长度，据说是依据当前系统中表示基本的字符编码的长度来确定。</p><p>换句话说，编码不仅仅是能用来表示数字的。</p><h2 id="ascii" tabindex="-1">ASCII <a class="header-anchor" href="#ascii" aria-label="Permalink to "ASCII""></a></h2><p>现在提到字节大家都会反应是8位，就是因为这个东西。</p><p>全名叫American Standard Code for Information Interchange（美国标准��息交换码）。</p><p>这套代码从上世纪60年代一致用到现在，足以说明有多么经典。然而我们先不说他是什么，简单的从我们自己的角度出发先设计一套东西。</p><h3 id="字符集" tabindex="-1">字符集 <a class="header-anchor" href="#字符集" aria-label="Permalink to "字符集""></a></h3><p>要知道美国人民的生活很是单调的，每天就面临大小写加起来四十多个字母，十个阿拉伯数字，以及十多个常用的标点符号。对比起来，深深地为自己的母语感到自豪。</p><p>当然，美国人民日常使用的字符量少，在信息化的时代，其实是有优势的，比如，把他们常用的字符加起来也就100个左右，而<span class="katex"><span class="katex-mathml"><!----></span><span class="katex-html" aria-hidden="true"><span class="strut" style="height:0.8141079999999999em;"></span><span class="strut bottom" style="height:0.853208em;vertical-align:-0.0391em;"></span><span class="base textstyle uncramped"><span class="mord"><span class="mord mathrm">2</span><span class="vlist"><span style="top:-0.363em;margin-right:0.05em;"><span class="fontsize-ensurer reset-size5 size5"><span style="font-size:0em;"></span></span><span class="reset-textstyle scriptstyle uncramped"><span class="mord scriptstyle uncramped"><span class="mord mathrm">6</span></span></span></span><span class="baseline-fix"><span class="fontsize-ensurer reset-size5 size5"><span style="font-size:0em;"></span></span></span></span></span><span class="mrel"><</span><span class="mord mathrm">1</span><span class="mord mathrm">0</span><span class="mord mathrm">0</span><span class="mrel"><</span><span class="mord"><span class="mord mathrm">2</span><span class="vlist"><span style="top:-0.363em;margin-right:0.05em;"><span class="fontsize-ensurer reset-size5 size5"><span style="font-size:0em;"></span></span><span class="reset-textstyle scriptstyle uncramped"><span class="mord mathrm">7</span></span></span><span class="baseline-fix"><span class="fontsize-ensurer reset-size5 size5"><span style="font-size:0em;"></span></span></span></span></span></span></span></span>，所以我们只要有长度为7位的二进制串长度就能把美国人民用的那些字符给完全表示出来。</p><p>比如我们可以定义，0000000 ～ 0001001 表示数字字符0-9， 0100001 ～ 0111010 表示大写字母字符的A-Z，1000001 ～ 1011010表示小写字母字符的a-z，于是我们就能对把对应的字母变成相应的编码了。</p><p>但是老是这样看着满屏的0和1，总是会感觉眼花。既然都是表示数据，并不是说相同的东西，计算机看到长什么样子，我们就要看一样的。只要是能够表示相同的数据，完全可以换一种我们更习惯的方式来表示。</p><h3 id="十六进制" tabindex="-1">十六进制 <a class="header-anchor" href="#十六进制" aria-label="Permalink to "十六进制""></a></h3><p>比如我们可以使用十六进制（Hexadecimal）代替二进制（Binary），也就是说，同一个位上面共有16个状态，习惯上分别用0-9加上a-f来表示，同时，为了与十进制表示进行区分，一般会加上0x前缀或者h后缀。对于刚刚的字符编码来说，就可以用0x00 ～ 0x09 表示 数字字符，0x21 ～ 0x3A 表示大写字母A-Z，0x40 ～ 0x5A表示小写字母a-z。</p><h4 id="为什么是十六进制而不是其他的十二进制或者十八、二十四进制呢" tabindex="-1">为什么是十六进制而不是其他的十二进制或者十八、二十四进制呢？ <a class="header-anchor" href="#为什么是十六进制而不是其他的十二进制或者十八、二十四进制呢" aria-label="Permalink to "为什么是十六进制而不是其他的十二进制或者十八、二十四进制呢？""></a></h4><p>我们可以简单的做一个对比：</p><div class="language-"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#A6ACCD;">Bin 0001 0010 0011 .... 1010 1011 1100 1101 1110 1111</span></span>
<span class="line"><span style="color:#A6ACCD;">Hex 1 2 3 A B C D E F</span></span>
<span class="line"><span style="color:#A6ACCD;">Dec 1 2 3 10 11 12 13 14 15</span></span></code></pre></div><p>十六进制的一位刚好一一对应二进制的每四个位。</p><p>于是本来用二进制表示起来很冗长的东西，用十六进制可以比较轻松的表述出来。而且相互之间的转换也很容易。</p><p>相反生活中常用的十进制跟二进制对应的就不那么协调，所以一般也比较少用，只要知道对应的位上的值就好。</p><p>也就是说，只要能够数</p><p><span class="katex-display"><span class="katex"><span class="katex-mathml"><!----></span><span class="katex-html" aria-hidden="true"><span class="strut" style="height:0.64444em;"></span><span class="strut bottom" style="height:0.8388800000000001em;vertical-align:-0.19444em;"></span><span class="base displaystyle textstyle uncramped"><span class="mord mathrm">1</span><span class="mpunct">,</span><span class="mord mathrm">2</span><span class="mpunct">,</span><span class="mord mathrm">4</span><span class="mpunct">,</span><span class="mord mathrm">8</span><span class="mpunct">,</span><span class="mord mathrm">1</span><span class="mord mathrm">6</span><span class="mpunct">,</span><span class="mord mathrm">.</span><span class="mord mathrm">.</span><span class="mord mathrm">.</span><span class="mpunct">,</span><span class="mord mathrm">1</span><span class="mord mathrm">0</span><span class="mord mathrm">2</span><span class="mord mathrm">4</span><span class="mpunct">,</span><span class="mord mathrm">2</span><span class="mord mathrm">0</span><span class="mord mathrm">4</span><span class="mord mathrm">8</span><span class="mpunct">,</span><span class="mord mathrm">.</span><span class="mord mathrm">.</span><span class="mord mathrm">.</span><span class="mpunct">,</span><span class="mord mathrm">3</span><span class="mord mathrm">2</span><span class="mord mathrm">7</span><span class="mord mathrm">6</span><span class="mord mathrm">8</span><span class="mpunct">,</span><span class="mord mathrm">6</span><span class="mord mathrm">5</span><span class="mord mathrm">5</span><span class="mord mathrm">3</span><span class="mord mathrm">6</span><span class="mpunct">,</span><span class="mord mathrm">1</span><span class="mord mathrm">3</span><span class="mord mathrm">1</span><span class="mord mathrm">0</span><span class="mord mathrm">7</span><span class="mord mathrm">2</span><span class="mpunct">,</span><span class="mord mathrm">.</span><span class="mord mathrm">.</span><span class="mord mathrm">.</span><span class="mpunct">,</span><span class="mord mathrm">2</span><span class="mord mathrm">1</span><span class="mord mathrm">4</span><span class="mord mathrm">7</span><span class="mord mathrm">4</span><span class="mord mathrm">8</span><span class="mord mathrm">3</span><span class="mord mathrm">6</span><span class="mord mathrm">4</span><span class="mord mathrm">8</span></span></span></span></span></p><p>嗯，我觉得如果你玩过2048的话一定不会对前面的那些数字感到陌生。</p><h3 id="ascii-1" tabindex="-1">ASCII <a class="header-anchor" href="#ascii-1" aria-label="Permalink to "ASCII""></a></h3><p>嗯，ASCII跟我们想的一样，选择了8位作为实际的长度，同时加入了一些必须要用到的特殊字符（比如制表符tab 0x09，回车记号carriage return 0x0D，换行符line feed 0x0A..），以及一些控制字符（比如空字符NUL 0x00，文件结束符EOF等）。于是整体的设计相对于我们的想法有一些偏移：</p><ul><li><code>\x30</code> ～ <code>\x39</code> 表示0-9</li><li><code>\x41</code> ～ <code>\x5a</code> 表示A-Z</li><li><code>\x61</code> ～ <code>\x7a</code> 表示a-z</li></ul><p>好的我们来试试吧：</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;">'</span><span style="color:#A6ACCD;">\x41</span><span style="color:#89DDFF;">'</span></span></code></pre></div><p>我们可以直接用引号<code>'</code>括起来单个字符，在程序中直接拿来使用。同时也可以反过来看：</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#C792EA;">let</span><span style="color:#A6ACCD;"> a_char </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">'</span><span style="color:#C3E88D;">a</span><span style="color:#89DDFF;">'</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#A6ACCD;">a_char</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">charCodeAt</span><span style="color:#A6ACCD;">(</span><span style="color:#F78C6C;">0</span><span style="color:#A6ACCD;">)</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">toString</span><span style="color:#A6ACCD;">(</span><span style="color:#F78C6C;">16</span><span style="color:#A6ACCD;">)</span></span></code></pre></div><h3 id="cjk字符集" tabindex="-1">CJK字符集 <a class="header-anchor" href="#cjk字符集" aria-label="Permalink to "CJK字符集""></a></h3><p>CJK（有时候也会带上V），是China，Japan，Korea（和Vietnam）的统称，在这些地区，因为同遗传自古汉语，字符的数量可是非常之多，8位的ASCII根本就没办法保存这么多东西。</p><p>于是随着各种语言诞生了各种编码，比如<code>GB2312</code> 简体中文，<code>Big-5</code> 繁体中文，<code>Shift-JIS</code> 日文等。这些编码并不是相互兼容的，于是一般对于特定的内容，需要专门指出其编码。同样地，当你尝试去一种编码来解释另外一种编码的文本时，就会出现<strong>乱码</strong>的情况。注意这个时候并不是你电脑中毒了。</p><h3 id="unicode" tabindex="-1">Unicode <a class="header-anchor" href="#unicode" aria-label="Permalink to "Unicode""></a></h3><p>所以就有人想，不如把所有的编码都统一了吧，于是就出现了Unicode。</p><p>现行版本的Unicode加入了世界上能够找到的绝大多数语言的符号（嗯，包括emoji），然后将这些符号分类整理，统一编码。于是，在理想情况下，大家都使用Unicode字符集的话，就不会出现乱码的错误了。</p><p>Unicode包含的字符量足够的多，于是就要设计比ASCII更充分大的表示方式才能够容纳所有的符号。最初选择的是每个字符使用16位的二进制串来表示，这样的话一个中文字符虽然会超出8位范围之外，还是能够表示得出来，这种方法被称为UTF-16。</p><p>然而不久就发现，符号的数量（就算仅仅是中文字符）远远多于65536个，于是又进一步地扩充到了32位，可以表示到上亿个字符了，目前为止还要很久才会资源枯竭，这种方法类似地，被称为UTF-32。</p><p>然而UTF-32有个很致命的缺点。</p><p>对于西方人来说，并没有CJKV地区的人的需求，1个字节就能足够表示他们的符号��而UTF-32硬生生地为了统一，要求字母字符也要用4个字节来表示，这样就让空间整整大了4倍，而且另外3倍的空间完全是浪费掉的，没有任何作用。</p><p>但是，为了兼容，没办法。</p><h3 id="utf-8" tabindex="-1">UTF-8 <a class="header-anchor" href="#utf-8" aria-label="Permalink to "UTF-8""></a></h3><p>于是为了解决这个浪费空间的问题，UTF-8出现了。这是来自Ken Thompson的设计，他给整个IT界贡献了不少东西，Unix、C语言、UTF-8。</p><p>简单来说就是，在保持与ASCII兼容的情况下，通过添加一些标记来支持更长的编码。</p><p>具体的做法当然维基百科介绍的比我更清楚，这里提起来只是要说这么一个思路：变长编码（Variable-Width Encoding）。因为比较重要的就是在设计的过程中考虑变量和不变量，以及设置各种标志和不同的数据区块解释方式，这样就可以把简单的二进制序列变成我们想要的任意数据。</p><p>当然，这里的思想我们会在第6章详细地展开。</p><h2 id="数系的扩充" tabindex="-1">数系的扩充 <a class="header-anchor" href="#数系的扩充" aria-label="Permalink to "数系的扩充""></a></h2><p>你有没有尝试计算JavaScript里面<code>1/3</code>的结果？</p><p>当我们需要小数的时候又该如何表示呢？</p><p>这个问题留作练习。</p><p>作为参考答案，你可以搜索IEEE754。</p></div></div></main><footer class="VPDocFooter" data-v-c4b0d3cf data-v-face870a><!--[--><!--]--><!----><div class="prev-next" data-v-face870a><div class="pager" data-v-face870a><a class="pager-link prev" href="/ch03_procedure.html" data-v-face870a><span class="desc" data-v-face870a>Previous page</span><span class="title" data-v-face870a>过程</span></a></div><div class="has-prev pager" data-v-face870a><a class="pager-link next" href="/ch05_sequence.html" data-v-face870a><span class="desc" data-v-face870a>Next page</span><span class="title" data-v-face870a>序列</span></a></div></div></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-b2cf3e0b data-v-2f86ebd2><div class="container" data-v-2f86ebd2><!----><p class="copyright" data-v-2f86ebd2>CC-BY 4.0 Licensed | Copyright © 2015-present Kimmy Leo</p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"summary.md\":\"6e51fa23\",\"ch01_environment.md\":\"ad374fcf\",\"ch06_data.md\":\"8876a824\",\"ch10_object.md\":\"a4f3746e\",\"intro.md\":\"ca4ae51e\",\"glossary.md\":\"9584a1ea\",\"ch05_sequence.md\":\"e9066e5e\",\"ch11_concurrency.md\":\"2b82afad\",\"ch09_closure.md\":\"a7117936\",\"stream.md\":\"a4405d7c\",\"index.md\":\"a7ecfcb0\",\"ch07_state.md\":\"5efbe2c2\",\"ch04_encoding.md\":\"6d49b0e8\",\"ch02_computation.md\":\"d79955df\",\"ch03_procedure.md\":\"2caba3b4\",\"ch08_reference.md\":\"ea346374\"}")
__VP_SITE_DATA__ = JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"编程导引\",\"description\":\"A VitePress site\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"编程导引\",\"link\":\"/intro\"}],\"sidebar\":[{\"text\":\"引言\",\"link\":\"/intro\"},{\"text\":\"环境\",\"link\":\"/ch01_environment\"},{\"text\":\"计算\",\"link\":\"/ch02_computation\"},{\"text\":\"过程\",\"link\":\"/ch03_procedure\"},{\"text\":\"编码\",\"link\":\"/ch04_encoding\"},{\"text\":\"序列\",\"link\":\"/ch05_sequence\"},{\"text\":\"数据\",\"link\":\"/ch06_data\"},{\"text\":\"状态\",\"link\":\"/ch07_state\"},{\"text\":\"引用\",\"link\":\"/ch08_reference\"},{\"text\":\"闭包\",\"link\":\"/ch09_closure\"},{\"text\":\"对象\",\"link\":\"/ch10_object\"},{\"text\":\"并发\",\"link\":\"/ch11_concurrency\"}],\"footer\":{\"copyright\":\"CC-BY 4.0 Licensed | Copyright © 2015-present Kimmy Leo\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}")</script>
</body>
</html>