JavaScript数据类型及类型转换

前言

最近在开发中写了一个比较低级的错误，使用if来判断字符串'false'，结果可想而知，结果一直是true。趁这个机会再总结回顾一下JS的基本类型以及类型转换的相关知识。

数据类型

JS一共有七种数据类型，六种基本类型（值类型），一种复杂数据类型（引用数据类型）。

六种基本数据类型分别是number、string、symbol、boolean、null、undefined，复杂数据类型是Object。

  123   // number
 '123' // string
  true // boolean
  const eg1 = Symbol() // symbol
  null // null
  undefined // undefined
  
  {} // object
  const object = function () {} // object

几种类型的简单示例如上，下面来介绍一下类型的判断

typeof

typeof 123 // 返回number
typeof '123' // 返回string

typeof运算符的简单使用就是直接加在想要判断的变量前边，但是这里有两个固有的JavaScript语言的Bug需要注意

typeof null // 返回object

const testFunction = function () {}
typeof testFunction // 返回function

显然，typeof null不应该返回object, typeof testFunction也不应该返回function,因为JS里面的七种类型根本没有function,function是属于一种特殊的Object

==和===

现在前端基本使用条件语句的时候大多数情况下用全等于===,而只在部分特殊情况下使用==。===和==的区别必须就在于==会对两端的数据在比较时进行类型转换。
===的使用比较简单，只要两端不完全一样，就为false

1 === '1' // false
1 === 1 // true
true === 1 // false
true === true // true
null === undefined // false

==在使用的时候如果两端类型不一样会尝试转换类型
转换规则如下

1. 如果有一个操作数是布尔值，则在比较相等性之前先将其转换为数值——false转换为0，而true转换为1
2. 如果一个操作数是字符串，另一个操作数是数值，在比较相等性之前先将字符串转换为数值
3. 如果一个操作数是对象，另一个操作数不是，则调用对象的valueOf()方法，用得到的基本类型值按照前面的规则进行比较

这里有两个比较特殊的类型, null和undefined与除了自身的任何数据比较都返回false,但是他们两个比较返回true

null == null // true
undefined == undefined // true
null == undefined // true

除了以上三种判断,null 和 undefined和任何数据判断都会返回false
下面是几个使用==的例子

1 == '1' // true
true == 1 // true
false == 0 // true

false

if(test) {}

在这个条件语句里，test可以不是Boolean，但是JS会自动把他转成boolean类型的，只有下面六种会被转成false,其他的都是true

• false
• null
• undefined
• 0
• ''
• NaN

值类型和引用类型的区别

在JS中还有一个重要但是会被人忽略的地方，看下例

123.toString()
'app'.toUpperCase()

在这个例子中,123是值类型number, 'app'是值类型String,他们都仅仅是一个值，按照基本规则是没有toString和toUpperCase来调用的，但是JS内部有九个内置的构造函数，Number, String是其中的两个,上面的方法调用其实是这样的

(new Number(123)).toString()
(new String('app')).toUpperCase()

这是很多人都会忽略的知识点，但是某些情况下也会用到，比如说我一般倾向于使用Number()来在某些情况下手动转换数据类型，而不是用parseInt, parseFloat这些函数

let num = Number('123')
typeof num // number

这里还有个知识点

let num = new Number('123')
typeof num // object

new Number()返回的是一个包装过的对象，和Number()返回的纯数值还是有所不同的。