详解JavaScript数据类型和判断方法

前言

JavaScript 中目前有 7 种基本（原始primitives）数据类型 Undefined， Null，Boolean， Number， String，BigInt，Symbol，以及一种引用类型 Object，Object 中又包括 Function，Date，JSON，RegExp等，除了 7 种原始类型，其他的所有能够用 new 实例化的内置类型都是 Object 构造的。

数据类型

对于数据了类型我们可以通过 typeof 运算符来判断，具体结果看下图。

原始类型中两个比较特殊的就是 Undefined 和 Null，他们两个类型都只有一个值就是 undefined 和 null。

Undefined

undefined 一般表示我们未对变量进行初始化。使用 typeof 操作符的时候，如果是未声明变量，同样也会返回 undefined，再比如未设置返回值的函数执行的结果是 undefined，未设置的参数也会被默认为 undefined。最后还有一点需要注意的是，undefined 并不是 js 的保留字，并且是全局对象的一个属性，在浏览器环境中就是 window.undefined。当在局部环境中，我们是可以自己给 undefined 属性赋值的，也就是重写 undefined，所以为了确保我们使用的 undefined 是未被重写的，我们可以使用 void 0 来代替。

Null

null 可以简单理解为一个未被创建的对象，比如我们使用 document.getElementById 并没有找到对应元素的时候就会返回 null。null 和 undefined 有一些区别，在转换为 Number 的时候，null 会转换为 0 而 undefined 会转换为 NaN，执行 typeof 运算的时候，undefined返回 undefined 而 null 返回 object。使用 == 判断两者相等会返回 true，所以为了防止误判一般我们使用全等 ===。null 是所有对象原型链的终点，Object.prototype.__proto__ === null。

关于 null 的使用，当我们声明一个变量是用来存储对象我们可以先赋值为 null，当一个对象不再需要的时候，我们可以设置为 null 解除这个引用。

Symbol 和 BigInt

这两个都是 ES6 新增的原始数据类型，Symbol 类型的数据通过 Symbol() 方法的执行产生，不过需要注意的是 Symbol 不能作为构造函数，每个从 Symbol() 返回的 symbol 值都是唯一的。一个 symbol 值能作为对象属性的标识符；这是该数据类型仅有的目的。

而 BigInt 则是为了精确表示超出双精度浮点数的最大安全表示范围的大数而新增的基本数据类型。

判断数据类型的方法

typeof 运算符

最简单的判断数据类型的方法是 typeof 运算符，返回值为字符串。typeof 的缺点是除了 Function 以外的其他所有对象的返回值都是 object （null 的返回值也是 object），如果我们需要区分不同的对象，就无法使用 typeof。

instanceof 运算符

instanceof 运算符是检测构造函数的原型是否出现在某个对象的原型链上。通过 instanceof 运算符我们可以实现对 Object 类型的细分，确定属于哪种对象。但是 instanceof 的缺点是只能对对象进行检测，对于基本数据类型的实例无法检测（字面量无法检测，但是通过基本包装类型的构造函数创建的基本类型可以进行检测）。

constructor 属性

利用实例的 constructor 属性来辅助判断实例的数据类型也是一种手段。一般来说，实例本身是没有 constructor 属性的，我们所看到的属性都是 实例.__proto__.constructor，换言之也就是实例的构造函数，这种方式对基本数据类型也是有效的。这种方法的一个比较大的问题是 constructor 属性是个不受保护的属性，随时可能被更改，我们既可以给实例增加 constructor 属性，也可以修改构造函数的 prototype 的引用，也可以直接修改原型的 constructor 属性。

Object.prototype.toString.call()

这是最安全准确的检测数据类型的方法，每一种数据类型的构造函数的原型上都有 toString 方法，但是除了 Object.prototype上的 toString 是用来返回当前实例所属类的信息（检测数据类型的），其余的都是转换为字符串的。该方法可以准确检测所有内置类型。自定义类型的返回值为 Object Object

let toString = Object.prototype.toString //=>Object.prototype.toString

console.log(toString.call(10)); //=>"[object Number]"
console.log(toString.call(NaN)); //=>"[object Number]"
console.log(toString.call("xxx")); //=>"[object String]"
console.log(toString.call(true)); //=>"[object Boolean]"
console.log(toString.call(null)); //=>"[object Null]"
console.log(toString.call(undefined)); //=>"[object Undefined]"
console.log(toString.call(Symbol())); //=>"[object Symbol]"
console.log(toString.call(BigInt(10))); //=>"[object BigInt]"
console.log(toString.call({xxx:'xxx'})); //=>"[object Object]"
console.log(toString.call([10,20])); //=>"[object Array]"
console.log(toString.call(/^\d+$/)); //=>"[object RegExp]"
console.log(toString.call(function(){})); //=>"[object Function]"

以上就是详解JavaScript数据类型和判断方法的详细内容，更多关于JavaScript数据类型和判断方法的资料请关注我们其它相关文章！