JS 9种数据类型区别及相互转换

数据类型分类

基本数据类型

• string
• number
• boolean
• object
• function
• symbol

引用数据类型

• Object
• Date
• Array

不包含任何值的数据类型

• null
• undefined

数据之间的转换

其他数据类型转换成 Number

转换方法

• Number(val)
• parseInt/parseFloat(val)

Number

浏览器内部默认 Number 转换在进行计算

Number("1");	// 1
Number("");		// 0
Number("  ");	// 0
Number("1 2");	// NaN
Number(true);	// 1
Number(null);	// 0
Number(undefined);	// NaN
Number("12px");		// NaN

结论：

• 布尔值转为数字 1 或 0
• null 转为数字 0
• 空字符串转换为数字 0
• undefined 转为 NaN，任何数加上 NaN 都等于 NaN
• 字符串中出现了非数字都将会转换为 NaN

parseInt/parseFloat

parseFloat：顾名思义，将字符串转换成整数

parseFloat：将字符串转换成浮点数

parseInt("1.1");	// 1
parseFloat("1.1");	// 1.1
parseInt("10px");	// 10
parseInt("");	// NaN
parseInt(null);	// NaN
parseInt(undefined);	// NaN
parseInt("asd");	// NaN

结论：

• 从左侧第一个字符开始查找，遇到非数字就停止
• parseFloat 比 parseFloat 多识别一个小数点
• 字符串中出现了非数字都将会转换为 NaN

其他数据转换成 String

转换方法

• toString(val)
• String(val)

String(123);	// "123"
String(123 + 1);	// "124"
(123).toString();	// "123"
(123 + 1).toString();	// "124"
[1, 2].toString();	// "1,2"
new Date().toString();	// "Wed Sep 02 2020 17:25:51 GMT+0800 (中国标准时间)"
(123 + "1").toString();	// "1231"

如果 + 号左边出现字符串或对象，就会按照字符串来拼接

其他数据转换成 Boolean

规则

• 只有 0、NaN、null、undefined、空字符串 五个值会被转为 false，其余都是true

• 隐式

  • 在条件判断中，条件处理的结果就是布尔值

• 显式

  • ! 转换为布尔值后取反
  • !! 取反之后再取反
  • Boolean(val)

Boolean(undefined);	// false
Boolean(0);	// false
Boolean(NaN);	// false
Boolean("");	// false
Boolean({});	// true
!Boolean("");	// true

+ 的转换规则

+ 可以把变量转换为数字

+"10";	// 10
+"asd";	// NaN

快速将时间转换为时间戳

+new Date();	//	1599039501529

== 的转换规则

类型一样

比较的是堆内存中的地址

1 == 1;	// true
"1" == "1";	// true
{} == {};	// false

类型不一样

只要 null == undefined 为 true，且 null/undefined 和其他任何数据类型的值都不相等

null == undefined;	// true
undefined == "1";	// false
null == "1";	// false

如果 == 号两边数据类型不同，会把两边的数据类型转为数字再做比较