JS 的数据类型 Note-FrontEnd-12

JS 的数据类型，内容包括数据分类、JS 的数字类型、数字 number、字符串 string、布尔 boolean、undefined 和 null、symbol、变量声明、类型转换。

一、数据分类

1. 数据为什么需要分类

比如说为什么要分数字和字符串

功能不同：

1. 数字是数字，字符串是字符串，要严谨
2. 数字能加减乘除，字符串不行
3. 字符串能表示电话号码，数字不行

存储形式不同：

1. JS 中，数字是用 64 位浮点数的形式存储的
2. JS 中，字符串是用类似 UTF-8 形式存储的（UCS-2）

2. 如何存数字

二进制存储，十进制或十六进制显示

二进制与十进制转换：2^n 自己去凑

二进制与十六进制转换：四位对应一位

3. 如何存字符

将字符一个个编号变成数字，然后存储。

1. ASCII 码 -- 用 0 ~ 127 表示字符

2. 国标 2312 -- 用 0000 ~ FFFF 表示汉字

3. GBK 国标扩 -- 收录了中日韩使用的几乎所有汉字

4. 万国码 Unicode -- 已经收录 13 万字符（大于 16 位），全世界通用

   两个字节不够用，每个字符要用三个及以上字节,这样所有文件都扩大 50%，不划算。

   鸡贼的存法 -- UTF-8，最少可用 8 位存一个字符

二、JS 的数字类型

JS 的七种数字类型：

1. 数字 -- number
2. 字符串 -- string
3. 布尔 -- bool
4. 符号 -- symbol
5. 空 -- undefined
6. 空 -- null
7. 对象 -- object

总结：四基两空一对象

三、数字 number

1. 写法

整数写法 -- 1
小数写法 -- 0.1
科学计数法 -- 1.23e4
八进制写法（用得少）-- 0123 或 00123 或 0o123
十六进制写法 -- 0x3F 或 0X3F
二进制写法 -- 0b11 或 0B11

2. 特殊值

正0 和 负0 -- 都等于0，要严谨
无穷大 -- Infinity、+Infinity、-Infinity
无法表示的数字 -- NoN

3. 64 位浮点数

浮点就是浮动的点，意思就是小数点会乱动

1 位表正负(0正1负)  |  11 位指数部分(有正负)  |  52 位有效数字(省掉第一个1)
——————————————————————————————————————
± 1.01100110 × 2^8 （二进制）

符号占 1 位、指数占 11 位（-1023 ~ 1024）、有效数字占 52 位（开头的 1 省略）

4. 范围（忽略符号位）和精度（有效数字）

Nmuber.MAX_VALUE: 1.7976931348623157e+308
Number.MIN_VALUE: 5e-324

最多只能到 52+1 个二进制位表示有效数字
2^53 对应的十进制是 9 后面15 个零
所以 15 位有效数字都能精确表示
16 位有效数字如果小于 90 开头，也能精确表示

四、字符串 string

在 JS 里面用的是阉割版 UTF-8

1. 写法

单引号 -- '你好'
双引号 -- "你好"
反引号 -- `你好`

2. 转义 -- 用另一种写法表示你想要的东西

\' 表示 '
\" 表示 "
\n 表示换行
\r 表示回车
\t 表示 Tab 制表符
\\ 表示 \
\uFFFF 表示对用的 Unicode 字符
\xFF 表示前 256 个 Unicode 字符

3. 多行字符串

如果你想要在字符串里回车

let s = `这样是
可以的
用反引号很容易做到`

4. 字符串的长度

'123'.length  // 3
'\n\r\t'.length  // 3
''.length  // 0
' '.length  // 1

5. 通过下标读取字符

string[index]

let s = 'hello';
s[0]  // "h"

let s = 'hello';
s[5]  // undefined，居然不报错
s[4]  // 'o'

6. base64 转码

window.btoa -- 正常字符串转为 Base64 编码的字符串

window.atob -- Base64 编码的字符串转为原来的字符串

五、布尔 boolean

只有两个值 -- true 和 fause，注意大小写

1. 以下运算会得到 bool 值

否定运算 -- !value
相等运算 -- 1 == 2、1 != 2、3 === 4、3 !== 4
比较运算 -- 1>2、1>=2、3<4、3<=4

2. 五个 falsy 值

除了这五个 falsy 值，其他都是 True

undefined
null
0
NaN
''

falsy 就是相当于 false 但又不是 false 的值

''和' '不是一个玩意 -- 再次声明，请保持严谨

六、undefined 和 null

两种空类型，两者没有本质区别

细节一：如果一个变量声明了，但没有赋值，那么默认值就是 undefined，而不是 null

细节二：如果一个函数，没有写 return，那么默认 return undefined，而不是 null

细节三：前端程序员习惯上，把非对象的空值写为 undefined 把对象的空值写为 null，但仅仅是习惯上而已

七、symbol

不常用的数据类型，详情请移步 JS 中的 Symbol 是什么？

八、变量声明

1. 三种声明方式

var a = 1 // var 是过时的、不好用的方式
let a = 1 // let 是新的，更合理的方式
const a = 1 // const 是声明时必须赋值，且不能再更改的方式
a = 1 // × 这是赋值，不是声明，不准这样写

2. let 声明 -- 规则

1. 遵循块作用域，即使使用范围不能超出 {}

{
    let b = 1
}
console.log(b)
// Error

2. 不能重复声明
3. 可以赋值，也可以不赋值
4. 必须先声明再使用，否则报错
5. 全局声明的 let 变量，不会变成 window 的属性（var 会）

强烈推荐阅读：《我用了两个月的时间才理解 let》

3. const 声明 -- 规则

1. 跟 let 几乎一样
2. 只有一条不一样：声明时就要赋值，赋值后不能改

九、类型转换

1. number => string

String(n)
n + ''
‘’ + n

2. string => number

Number(s)
parseInt(s) / parseFloat(s)
s -0
+s

3. x => bool

Boolean(x)
!!x

4. x => string

String(x)
x.toString()

「资料来源：©饥人谷」