JS获取数据类型方法总结

1. typeof

（1）介绍

typeof 操作符返回一个字符串，表示未经计算的操作数的类型。

typeof是运算符，返回值是小写的字符串。

（2）语法

typeof(operand)或typeof operand

参数：operand ： 一个表示对象或原始值的表达式，其类型将被返回。

（3） 例：

console.log('1的结果为: '  + typeof 1);
console.log(' "1" 的结果为: ' + typeof  '1');
console.log('undefined的结果为: ' + typeof undefined);
console.log('null的结果为: ' + typeof null);
console.log('NaN的结果为: ' + typeof NaN);
console.log('1n的结果为: ' + typeof 1n);
console.log('Symbol(1)的结果为: ' + typeof Symbol(1));
console.log('true的结果为: ' + typeof true);
console.log('function() {}的结果为: ' + typeof function() {});
console.log("[1, '1']的结果为: " + typeof [1, '1']);
console.log("{a: 1}的结果为: " + typeof {a: 1});
console.log("日期的结果为: " + typeof new Date());
console.log("正则的结果为: " + typeof /\d/);

输出：

（4）缺点

（1）typeof对于大部分简单数据类型能检测出，引用数据类型检测不出来。如数组、日期、正则、对象所检测出的结果都是object，不过可以判断出function。

（2）typeof null 会返回object

2. instanceof

（1）介绍

instanceof 运算符用于检测构造函数的 prototype 属性是否出现在某个实例对象的原型链上。即检测对象A是否为对象B的实例。但是判断不了A具体是什么数据类型，B要求是对象类型。

instanceof 返回布尔值。

（2）语法

object instanceof constructor

参数：

object：某个实例对象
constructor：某个构造函数

（3）原理

查看B对象的prototype属性指向的原型对象是不是在A的原型链上，若存在返回true,否则返回false。

例：

function Fruit (name, color) {
  this.name = name;
  this.color = color;
}
function Apple (shape) {
  this.shape = shape;
}

Apple.prototype = new Fruit('红富士', 'red');  //继承
let newApple = new Apple('圆的');

console.log(newApple);

console.log(newApple instanceof Apple);  //true
console.log(newApple instanceof Fruit);  //true
console.log(newApple instanceof Object);  //true

输出：

原型链：newApple —(–proto–)—> Apple.protoType —(–proto–)—> Fruit.protoType —(–proto–)—> Object.protoType —(–proto–)—> null

需要注意的是，如果表达式 newApple instanceof Fruit 返回 true，则并不意味着该表达式会永远返回 true，因为 Fruit.prototype 属性的值有可能会改变，改变之后的值很有可能不存在于 newApple 的原型链上，这时原表达式的值就会成为 false。另外一种情况下，原表达式的值也会改变，就是改变对象newApple的原型链的情况，虽然在目前的ES规范中，我们只能读取对象的原型而不能改变它，但借助于非标准的 __proto__ 伪属性，是可以实现的。比如执行 newApple.__proto__ = {} 之后，newApple instanceof Fruit 就会返回 false 了。

（4） 例

console.log('1是number类型吗？ ');
console.log(1 instanceof Number);
console.log('new Number(1)中1是number类型吗？ ');
console.log(new Number(1) instanceof Number);
console.log(' "1"字符串吗？  ' );
console.log( '1' instanceof String);
console.log('new String(1)中1是String类型吗？ ' );
console.log( new String(1) instanceof String);
console.log('true是布尔型吗？  ' );
console.log(true instanceof Boolean);
console.log('new Boolean(true)中1是Boolean类型吗？ ' );
console.log(  new Boolean(true) instanceof Boolean);
console.log('undefined是Object吗？  ' );
console.log(undefined instanceof Object);
console.log('null是Object吗？  ' );
console.log(null instanceof Object);
console.log('Symbol是Symbol类型吗？  '  ); 
console.log(Symbol() instanceof Symbol);
console.log('Object(Symbol())是Symbol类型吗？  ' ); 
console.log(Object(Symbol()) instanceof Symbol);
console.log('1n是BigInt类型吗？  ' ); 
console.log(1n instanceof BigInt);
console.log('Object(1n) 是BigInt类型吗？  ' ); 
console.log(Object(1n) instanceof BigInt);
console.log('function 是Function类型吗？  ' );
console.log((function() {}) instanceof Function);
console.log('[] 是Array类型吗？  ' );
console.log([] instanceof Array);
console.log('new Date() 是Date类型吗？  ' ); 
console.log(new Date() instanceof Date);
console.log('/regex/ 是RegExp类型吗？  '  ); 
console.log(/regex/ instanceof RegExp);
console.log('{} 是Object类型吗？  '  ); 
console.log({} instanceof Object);

输出：

（5） 缺点

（1）instanceof能够检查object、date、array、function等引用类型，但是检查不了number、boolean、string 等基本数据类型。
（2）由于返回的布尔值，所以不能直观看到数据类型。

3. constructor（不推荐）

（1）介绍

查看对象对应的构造函数。
constructor 在其对应对象的原型下面，是自动生成的。当我们写一个构造函数的时候，程序会自动添加：构造函数名.prototype.constructor = 构造函数名

（2） 例：

var str = '1';
console.log(str.constructor === String); //true
var bool = true;
console.log(bool.constructor === Boolean); //true
var num = 1;
console.log(num.constructor === Number); //true
//null和undefined是无效的对象，没有constructor
// var nul = null;
// console.log(nul.constructor == Object); //报错
// var und = undefined;
// console.log(und.constructor == Object); //报错
var newDate = new Date();
console.log(newDate.constructor === Date); //true
var newObject = {};
console.log(newObject.constructor === Object); //true
var arr = [];
console.log(arr.constructor === Array); //true
var reg = /\d/;
console.log(reg.constructor === RegExp); //true
var newfunction = function(){};
console.log(newfunction.constructor === Function); //true
var error = new Error();
console.log(error.constructor === Error); //true

输出：

（3）缺点

constructor属性是可以被修改的，会导致检测出的结果不正确。

例：

function A(){}
A.prototype.constructor = A; //写了一个构造函数A，程序自动添加，A的构造函数指向A
function B(){}
A.prototype.constructor = B; //把A的构造函数指向B了
console.log(A.construtor === A); //false

输出：

因此，不推荐。

4. Object.prototype.toString.call() （推荐）

（1）介绍

可以精准得判断出数据类型。

（2）语法

Object.prototype.toString.call(param)

（3）原理

Object上有两个toString方法，一个在Object本身，另一个在Object.prototype原型对象上。Object.prototype上的toString()方法具有判断数据类型的功能。默认情况下，toString() 方法被每个 Object 对象继承。如果此方法在自定义对象中未被覆盖，toString() 返回 “[object type]”，其中 type 是对象的类型。也就是说，Object本身上的toString()方法是继承了原型上的方法后进行了重写。Array，function等类型作为Object的实例，都重写了toString()方法，调用的时候直接调用重写的toString()方法。

只有Object.prototype上的toString具有判断数据类型的功能，因此我们使用其判断数据类型需要使用call方法改变this指向。

原理例：

let arr = [1, '1']
console.log(Object.prototype.toString(arr));
console.log(Object.prototype.toString.call(arr));

输出：

解释： 不加call()，this指针指向object，因此数据类型是object，
加了call()，this指向arr，调用了数组的重写的toString()方法，结果为Array类型。

（4）例

console.log(Object.prototype.toString.call(1));   
console.log(Object.prototype.toString.call('1'));  
console.log(Object.prototype.toString.call(undefined));    
console.log(Object.prototype.toString.call(null));   
console.log(Object.prototype.toString.call(true));   
console.log(Object.prototype.toString.call({}));   
console.log(Object.prototype.toString.call([]));   
console.log(Object.prototype.toString.call(function(){}));   
console.log(Object.prototype.toString.call(new Date()));   
console.log(Object.prototype.toString.call(/\d/));   
console.log(Object.prototype.toString.call(1n));   
console.log(Object.prototype.toString.call(Symbol()));   

输出：

5. isArray()

（1）介绍

Array.isArray() 用于确定传递的值是否是一个 Array。返回布尔值。

（2）语法

Array.isArray(obj)

参数：
obj：需要检测的值。

（3） 例

let arr = [1, '1'];
let obj = {a: 1};
console.log(Array.isArray(arr));
console.log(Array.isArray(obj));

输出：

参考：

1. MDN官网
2. instanceof原理
3. 判断js数据类型的四种方法，以及各自的优缺点 //参考构造函数判断类型
4. Object.prototype.toString.call(obj)的理解