为什么要学编程基础

因为你首先是程序员，其次才是前端。

一个程序员需要知道

硬件与软件：计算机的运行原理（《编码》），以及大学计算机相关课程，例如《计算机组成原理》、《计算机网络》，我在上大学的时候，老师有讲过计算机原理

最大的软件：操作系统（维基百科）了解操作系统由什么构成的

自己写软件：数据结构 & 算法（《数据结构与算法分析》）数据结构与算法分析，排序算法

多人写软件：软件工程（代码大全）

前端为什么要学编程基础?

• 操作系统运行在硬件之上
• 浏览器运行在操作系统之上，不仅仅是浏览器，所有的软件都是运行在操作系统之上的。
• HTML/CSS/JS运行在浏览器之上
• HTML/CSS/JS和数据都来自服务器

存在三层依赖,所以我们前端需要学习编程基础,我们才会知道

• CSS/JS是怎样运行的?
• JS的变量存储在哪里?
• 数据怎么从服务器获取?

计算机: 二进制的世界

1. 为什么计算机只能存储0和1？
2. 如何存储0和1
3. 如何存储数字
4. 如何存储字符
5. 如何存储中文
6. 如何存储所有字符
7. 如何用更少的空间来存储

1. 为什么计算机只能存储0和1？

这其中涉及到很多硬件知识，简单的来说，因为电脑是集成电路，内存微观上是无数小开关，或者是小电池，而“0”和“1”正好分别代表“开”和“关”（或者是“通电”和“不通电”），就好像家里的电灯开关只有开和关一样。所以，电脑的本质决定了它必须是二进制，只能存储0和1

2. 如何存储0和1

计算机存储过程，其实就是给小电池不断充电的过程，因为小电池自身存在耗电（好比家里的南孚电池放久了不用自己会消耗电量一样）。那么，既然小电池自己会耗电，又要不断充电，如何判断它是的状态是0和1呢？规则是：当小电池电量大于50%，为1；电量小于50%，则为0。因为计算机的充电速率是纳秒级（10^{-9）,即一次充电过程为：刷新1次/10}-9S。

计算机首先纵向,从上往下选中8个点,然后横向输入电量

竖向的认为一组晶体管，用来保存如数字8的值

横向的电路用来给晶体管充电。

内存如何存储0和1.png

存储

• 1就充电(变成红色)
• 0就不充电(不变色)

读取

• 电量大于50% 就是1
• 电量小于50% 就是0

通过这样内存就实现可以存储0和1

3. 如何存储数字

计算机只存储0和1,所以存储数字,需要将数字（八进制、十进制、十六进制）转换为二进制的0和1

十进制 --> 二进制

37(10) == 100101(2) 括号里面的数字代表是什么进制

*代表是乘,^代表是多少次方,?代表未知,需要求出来

37(10)  = 3 * 10^1 + 7 * 10^0
        = n1 * 2^? + n2 * 2^?
        = 32 + 4 + 1
        = 1 * 2^5 + 1 * 2^2 + 1 * 2^0
        = 1 * 2^5 + 0 * 2^4 + 0 * 2^3 + 1 * 2^2 + 0 * 2^1 + 1 * 2^0
        = 100101(2)

-37(10) == -100101(2)

负数会以补码的形式存储,比较复杂,这里不做多讲

0.75(10) == 0.11(2)

0.75(10)  = 7 * 1/10 + 5 * 1/10^2
          = n1 * 1/2 + n2 * 1/4
          = 0.5 + 0.25
          = 1* 1/2 + 1 * 1/4
          = 0.11(2)

小Tips:

为了方便书写,一般会将二进制写为十六进制

二进制 --> 十六进制,每四个二进制代表一个十六进制数

举个例子下面的转换可以跟这个例子推出来:

1111(2) --> F(16)

1111(2) = 2^3 + 2^2 + 2^1 + 2^0 = F(16)

进制转换之方法2

• 整数

  
  
  整数.png

• 小数

  
  
  小数.png

4. 如何存储字符

使用ASCII表（用十进制数字来代替经常出现的符号和大小写英文字母）来存储少量的字符串

将每个字符编号

ASCII(American Standard Code for Information Interchange,美国信息交换标准代码)

美国信息交换标准代码是基于拉丁字母的一套计算机编码系统。它主要用于显示现代英语，而其扩展版本EASCII则可以部分支持其他西欧语言，并等同于国际标准ISO/IEC 646。

你想存储a,就需要存储97(10)对应的二进制

97(10)  = 9 * 10^1 + 7 * 10^0
        = n1 * 2^? + n2 * 2^?
        = 64 + 32 + 1
        = 1 * 2^6 + 1 * 2^5 + 1 * 2^0
        = 01100001(2) == 61(16)

你想存储A,就需要存储65(10)对应的二进制

65(10)  = 6 * 10^1 + 5 * 10^0
        = n1 * 2^? + n2 * 2^?
        = 64 + 1
        = 1 * 2^6  + 1 * 2^0
        = 01000001(2) == 41(16)

通过上面的例子说明计算机会认为A和a是不一样,因为所对应的ASCII不同

5. 如何存储中文

使用GBK

• GB 2312 中国国家标准简体中文字符集
• 微软推出的GBK 字符集(存储生僻字、繁体字、日语、朝鲜语等)
• GB2312 共收录 6763 个汉字，同时收录了包括拉丁字母、希腊字母、日文平假名及片假名字母、俄语西里尔字母在内的 682 个字符。

6. 如何存储所有字符

为了将所有字符都能够在电脑上显示，然而不同的字符集考虑到兼容性问题，Unicode联盟做了这样一件事，他们将全世界的文字都编在一张表中。

缺点：原来使用ASCII字符编码进行存储时，只需要1个字节即8位存储就足够，但是使用Unicode却需要4个字节即32位来存储；原来存储一个中文字符需要2个字节即16位，使用Unicode后需要4个字节32位存储。这样大大的浪费了存储空间。

• Unicode 字符集
• unciode万国码,将全球字符编号,包括中日韩文字、藏文、盲文、楔形文字、 颜文字:-)、 绘文字

7. 如何用更少的空间来存储

低性价比

a -> 00000000 00000000 00000000 011000012 = 0061(16)

你 -> 00000000 00000000 01001111 011000002 = 4F60(16)

高性价比 UTF-8

a -> 01100001

你-> 11100100 10111101 10100000

低性价比,因为计算机需要使用4个字节来存储

下面解释一下"你"的UTF-8

//Unicode
你 -> 00000000 00000000 01001111 011000002
//utf-8
你-> 11100100 10111101 10100000
//1110 表示告诉计算机,读取的时候往后读三个字节,每个字节开头都是10,除我之外,10都是表示我跟着前面的

UTF-8 是一种编码方式，不是字符集

UTF-8的编码方式

现实问题

• 为什么有些中文软件喜欢用GBK,不用Unicode/UTF-8?

  （1）发展史：当时在国内发明GB 2312的早几年，微软的GBK还没有出现，大家习惯了使用 GB 2312 和 GB13000 ，而新出来的Unicode虽然全球统一，但是还不完善，没有采用UTF-8的编码方式。之后GBK的出现，对原来的GB 2312更加优化，深受大家的喜爱。而到后来2000年出现的 GB 18030-2000 ，它统一和兼容了GBK，但是90年到2000年初，代大家还是习惯性的使用GBK字符集。

  （2）国情：在当时的背景下，信息相对比较闭塞，并不是什么东西像如今Google一下就可找到，所以在国内90年代大部分软件使用的字符集依然是GBK

• Javascript使用Unicode字符集,但是没有使用UTF-8编码

  • Javascript用了UCS-2编码,因为1995年UTF-16还没被发明出来,Javascript也不想使用 UTF-32,Unicode与JavaScript详解
  • 出现的后果:ES5 无法表示 \uFFFF 之后的字符（如 \u1D306）,某些情况下会出 bug,Javascript有个Unicode的天坑

ASCII，Unicode，UTF-8，GBK关系是什么？

1. 一开始只有ASCII字符集，因为初期只有欧美国家才能指定计算机规则。
2. 中国也需要想计算机输入中文，因此在ASCII127号（127号以下叫半角字符，其他叫全角字符）之后的符号取消，用两个大于127字符连在一起，表示一个汉字，命名为GBK2312，可以认为GBK2312就是ASCII的中文扩展。
3. 又添加了字符，但是GBK2312已经不够了，所以干脆直接把ASCII127之后的再重新一个位置放入一个中文字符，作为GBK字符集
4. 这时候出现了Unicode，能包括所有的字符。缺点就是无论你是英文还是中文，都必须用两个字节（16个0和1）来存储。
5. 这时候，UTF-8出现了，它可以根据不同的字节长度来变化UTF-8的长度，比如当字符在ASCII中，就用一个字节（字节：用8个0或1来表示一个字符）表示，中文就用3个字节表示

两个不太熟悉的题目

1. Unicode 字符集中，字符「你」对应的16进制数是多少？（答案是四个字符）参考 [站长工具](http://tool.chinaz.com/tools/unicode.aspx (中文 = > unicode方法)

答案：4f60

2. 字符「你」的 UTF-8 编码是多少，请用十六进制表示（可以百度谷歌，参考 http://graphemica.com/%E4%BD%A0 ）（中文 = > UTF-8 方法）

技巧：ctrl+f，在页面内搜索「UTF-8」,然后翻译十六进制是hex，判断出答案

答案：e4bda0

拓展思考：

• 编码方式与字符集的区别，编码方式？字符集？
• 如何将Unicode存到计算机里面
• 十六进制，unicode，UTF-8的区别
  • unicode（是十六进制）是高效 UTF-8 （同样是十六进制）的储存方法。
• 负数会以补码的形式存储
• 小数会以浮点数的形式存储