JavaScript学习之数据类型(1)

1.简介

JavaScript 的数据类型有6种

• 数值(number):整数和小数(比如1和3.14)
• 字符串(string): 文本(比如Hello World)。
• 布尔值(boolean): 即* true(真)和false(假)
• undefined: 表示“未定义”或不存在
• null: 表示空值,即此处的值为空。
• 对象(object): 各种值组成的集合。

1.数值,字符串,布尔值这三种类型,全称为原始类型(primitive type)的值,不可再细分
2.对象则称为合成类型(complex type)的值,
3.undefined和null，特殊值

JavaScript 有三种方法，可以确定一个值到底是什么类型。分别是typeof运算符,instanceof运算符,Object.prototype.toString方法

typeof 123 //"number"
typeof abc //"undefined" 因为abc没有未定义
typeof 'abc' //"string"
typeof false //"boolean"
typeof null //"object"

2.null 和 undefined

1.类型不一样：
console.log(typeOf undefined);//undefined
console.log(typeOf null);//object

2.转化为值时不一样：undefined为NaN ,null为0
console.log(Number(undefined));//NaN
console.log(Number(10+undefined));//NaN
console.log(Number(null));//0
console.log(Number(10+null));//10

3.比较
undefined === null;//false
undefined == null;//true

3.布尔值(boolean)

真用true表示,假用false表示
false,undefined,null,0,NaN,""或''(空字符串) 这几个值都会被转换为false
空数组([])和空对象({})对应的布尔值，都是true。

4.数值(number)

JavaScript内部所有的数字都是以64位浮点数形式储存,因此

1 === 1.0 //true

JavaScript 浮点数在计算中要注意精度问题

0.1 + 0.2 == 0.3 // false
0.3 / 0.1 //2.9999999999999996
(0.3 - 0.2) === (0.2 - 0.1) //false

4.1数值的精度

JavaScript 浮点数的64个二进制位，从最左边开始

• 第1位：符号位，0表示正数，1表示负数
• 第2位到第12位（共11位）：指数部分
• 第13位到第64位（共52位）：小数部分（即有效数字）

符号位决定了一个数的正负，指数部分决定了数值的大小，小数部分决定了数值的精度,指数位有11个二进制位,因此通过Math.pow(2,11)可算出范围是0~2047, IEEE 754 规定，如果指数部分的值在0~2047之间（不含两个端点,那么有效数字的第一位默认总是1，也就是说，有效数字这时总是1.xx...xx的形式，其中xx..xx的部分保存在64位浮点数之中，最长可能为52位。因此，JavaScript 提供的有效数字最长为53个二进制位。

公式
(-1)^符号位 * 1.xx...xx * 2^指数部分

因此JavaScrip能够表示的数的精度范围是-2^53 到2^53

Math.pow(2, 53) // 9007199254740992 
Math.pow(2, 53) + 1 // 9007199254740992 精度不准
Math.pow(-2, 53) //-9007199254740992 
Math.pow(-2, 53) - 1 //-9007199254740992 精度不准

4.2 数值范围

64位浮点数的指数部分的值最大为2047,正负数各占一半,因此JavaScript 能够表示的数值范围为2^1024 ~ 2^-1023(开区间),如果一个数大于等于2的1024次方,就会发生“正向溢出”,返回值为Infinity

Math.pow(2, 1024) // Infinity

如果一个数小于等于2的-1024次方,就会发生“逆向溢出”,返回值为0

Math.pow(2, -1075) // 0

Number.MAX_VALUE //1.7976931348623157e+308
Number.MIN_VALUE // 5e-324

4.3数值的表示法

当以下两种情况时，JavaScript会自动转化为科学计数法

• 小数点前的数字多余21个

1234567890123456789012   //输出 1.2345678901234568e+21

123456789012345678901   //输出 123456789012345680000

• 小数点后的零多于5个

0.0000001 // 1e-7
0.000001 //0.000001

4.4数值的进制

• 十进制：我们平时正常用的数字
• 二进制：前缀0b或0B
• 八进制：前缀0O或0o 或者只用了前导0，且只用了0~7的八个阿拉伯数字
• 十六进制：前缀0x或0X

4.5特殊数值

4.5.1 正零和负零

除了正零和负零做分母的时候值不同，其他时候正零和负零是一样的

(1 / +0) === (1 / -0) // false

是因为除以正零得到+Infinity，除以负零得到-Infinity，这两者是不相等的

4.5.2 NaN

NaN是特殊值,表示"非数字"(Not a Number)

5 - 'x' // NaN

0除以0也会得到NaN

0 / 0 // NaN

NaN不等于任何值，包括它本身。

NaN === NaN // false

NaN在布尔值中是false
NaN在与任何数(包括他自己)运算时都显示的是NaN

4.5.3 Infinity

Infinity有正负之分，Infinity表示正的无穷，-Infinity表示负的无穷
Infinity与null计算时，null会转成0，等同于与0的计算。
Infinity与undefined计算，返回的都是NaN。

Math.pow(2, 1024) // Infinity
0 / 0 // NaN
1 / 0 // Infinity
Infinity === -Infinity // false
1 / -0 // -Infinity
-1 / -0 // Infinity

4.6.与数值相关的全局方法

4.6.1 parseInt()

将字符串转为整数。

parseInt('123') // 123

如果字符串头部有空格，空格会被自动去除。

parseInt('   123') // 123

如果parseInt的参数不是字符串，则会先转为字符串再转换。

parseInt(1.23) // 1
// 等同于
parseInt('1.23') // 1

字符串转为整数的时候,是一个个字符依次转换,如果遇到不能转为数字的字符,就不再进行下去,返回已经转好的部分。

parseInt('8a') // 8
parseInt('12**') // 12
parseInt('12.34') // 12
parseInt('15e2') // 15
parseInt('15px') // 15

如果字符串的第一个字符不能转化为数字(后面跟着数字的正负号除外),返回NaN

parseInt('abc') // NaN
parseInt('.3') // NaN
parseInt('') // NaN
parseInt('+') // NaN
parseInt('+1') // 1

所以,parseInt的返回值只有两种可能,要么是一个十进制整数,要么是NaN

parseInt方法还可以接受第二个参数(2 ~ 36)之间的整数,表示被解析的值的进制,返回该值对应的十进制数,如果超出这个范围,则返回NaN。如果第二个参数是0、undefined和null，则直接忽略。

parseInt('100') // 100
// 等同于
parseInt('100', 10) // 100

parseInt('100', 2) // 4  二进制数100转化成十进制数 结果为4
parseInt('100', 6) //36
parseInt('100', 8) // 64

如果字符串包含对于指定进制无意义的字符，则从最高位开始，只返回可以转换的数值。如果最高位无法转换，则直接返回NaN。

parseInt('1234', 2) // 1 
parseInt('234', 2) // NaN

4.6.2 parseFloat()

将字符串转为浮点数

parseFloat('3.14') // 3.14
parseFloat('314e-2') // 3.14
parseFloat('0.0314E+2') // 3.14

如果字符串包含不能转为浮点数的字符，则不再进行往后转换，返回已经转好的部分。

parseFloat('8.88lalala') // 8.88
parseFloat('\t\v\r12.34\n ') // 12.34

如果参数不是字符串，或者字符串的第一个字符不能转化为浮点数，则返回NaN。

4.6.3 isNaN()

判断一个值是否为NaN
isNaN只对数值有效，如果传入其他值，会被先转成数值

isNaN(NaN) // true 
isNaN(123) // false

isNaN为true的值，有可能不是NaN，而是一个字符串

isNaN('Hello') // true
// 相当于
isNaN(Number('Hello')) // true

对于对象和元素为字符的数组，isNaN也返回true

isNaN({}) // true
// 等同于
isNaN(Number({})) // true

isNaN(['xzy']) // true
// 等同于
isNaN(Number(['xzy'])) // true

对于空数组和只有一个数值成员的数组，isNaN返回false,因为这些数组能被Number函数转成数值

isNaN([]) // false
isNaN([123]) // false
isNaN(['123']) // false

判断NaN的方法

function myIsNaN(value) {
  return typeof value === 'number' && isNaN(value);
}

//更可靠
function myIsNaN(value) {
  return value !== value;
}

4.6.4 isFinite()

表示某个值是否为正常的数值,返回一个布尔值.

isFinite(Infinity) // false
isFinite(-Infinity) // false
isFinite(NaN) // false
isFinite(undefined) // false
isFinite(null) // true
isFinite(-1) // true

除了Infinity、-Infinity、NaN和undefined这几个值会返回false，isFinite对于其他的数值都会返回true

5 字符串

字符串就是零个或多个排在一起的字符，放在单引号或双引号之中

'I like China'
'It's a sunny day'
'key = "value"' //key = "value"

单引号中用单引号,要使用'\'转义,双引号同理

'she is so \'sad\''     //she is so 'sad'
"she is so \"sad\""    //she is so "sad"

字符串默认只能写在一行内 分成多行将会报错

' a
b
' //Uncaught SyntaxError: Invalid or unexpected token

如果要换行写,则可以在每一行的尾部使用反斜杠
'a \
b \
c \ ';  //a b c

连接运算符(+)可以连接多个单行字符串

console.log('a' + 'b' + 'c')  //abc

如果想输出多行字符串，有一种利用多行注释的变通方法

(function () { /*
a
b
c
*/}).toString().split('\n').slice(1, -1).join('\n')
//"a
//b
//c"

字符串可以被视为字符数组

var a = 'hello'
a[1]  // e

如果方括号中的数字超过字符串的长度，或者方括号中根本不是数字，则返回undefined

a[10]  //undefined  
a['x'] //undefined

length属性

a.length //5

Base64 转码

JavaScript 原生提供两个 Base64 相关的方法。这两个方法不适合非 ASCII 码的字符，会报错
btoa()：任意值转为Base64编码
atob()：Base64 编码转为原来的值

var string = 'Hello World!';
btoa(string) // "SGVsbG8gV29ybGQh"
atob('SGVsbG8gV29ybGQh') // "Hello World!"

btoa('你好') // 报错

要将非 ASCII 码字符转为Base64 编码，必须中间插入一个转码环节，再使用这两个方法。

function b64Encode(str) {
  return btoa(encodeURIComponent(str));
}

function b64Decode(str) {
  return decodeURIComponent(atob(str));
}

b64Encode('你好') // "JUU0JUJEJUEwJUU1JUE1JUJE"
b64Decode('JUU0JUJEJUEwJUU1JUE1JUJE') // "你好"

参考链接:https://wangdoc.com/javascript/types/index.html