JS四种数据类型判断方法

1. typeof

typeof是一个运算符，其有两种使用方式：（1）typeof(表达式)；（2）typeof 变量名；返回值是一个字符串，用来说明变量的数据类型；所以可以用此来判断number, string, object, boolean, function, undefined, symbol 这七种类型，每种情况返回的内容如下表所示

类型	结果
String	'string'
Number	'number'
Boolean	'boolean'
Undefined	'undefined'
Object	'object'
function函数	'function'
Symbol	'symbol'

小试牛刀

// 字符串
console.log(typeof('lili')); // string
// 数字
console.log(typeof(1)); // number
// 布尔值
console.log(typeof(true)); // boolean
// undefined
console.log(typeof(undefined)); // undefined
// 对象
console.log(typeof({})); // object
// 数组
console.log(typeof([])); // object
// null
console.log(typeof(null)); // object
// 函数
console.log(typeof(() => {})); // function
// Symbol值
console.log(typeof(Symbol())); // symbol

 有些时候，typeof 操作符会返回一些令人迷惑但技术上却正确的值：

• 对于基本类型，除 null 以外，均可以返回正确的结果。
• 对于引用类型，除 function 以外，一律返回 object 类型。
• 对于 null ，返回 object 类型。
• 对于 function 返回  function 类型。

其中，null 有属于自己的数据类型 Null ， 引用类型中的 数组、日期、正则 也都有属于自己的具体类型，而 typeof 对于这些类型的处理，只返回了处于其原型链最顶端的 Object 类型，没有错，但不是我们想要的结果。

2. instanceof

instanceof运算符用于检测构造函数的 prototype属性是否出现在某个实例对象的原型链上,返回值为布尔值，用于指示一个变量是否属于某个对象的实例。

object instanceof constructor

小试牛刀

const arr = [1, 2];
// 判断Object的prototype有没有在数组的原型链上
console.log(arr instanceof Object); // true
// 数组arr的原型
const proto1 = Object.getPrototypeOf(arr);
console.log(proto1); // []
// 数组arr的原型的原型
const proto2 = Object.getPrototypeOf(proto1);
console.log(proto2); // []
// Object的prototype
console.log(Object.prototype);
// 判断arr的原型是否与Object的prototype相等
console.log(proto1 === Object.prototype); // false
// 判断arr的原型的原型是否与Object的prototype相等
console.log(proto2 === Object.prototype); // true

[] instanceof Array; // true
{} instanceof Object;// true
new Date() instanceof Date;// true
 
function Person(){};
new Person() instanceof Person;
 
[] instanceof Object; // true
new Date() instanceof Object;// true
new Person instanceof Object;// true

虽然 instanceof 能够判断出 [ ] 是Array的实例，但它认为 [ ] 也是Object的实例，为什么呢？

我们来分析一下 [ ]、Array、Object 三者之间的关系：

从 instanceof 能够判断出 [ ].__proto__  指向 Array.prototype，而 Array.prototype.__proto__ 又指向了Object.prototype，最终 Object.prototype.__proto__ 指向了null，标志着原型链的结束。因此，[]、Array、Object 就在内部形成了一条原型链：

从原型链可以看出，[] 的 __proto__  直接指向Array.prototype，间接指向 Object.prototype，所以按照 instanceof 的判断规则，[] 就是Object的实例。依次类推，类似的 new Date()、new Person() 也会形成一条对应的原型链 。因此，instanceof 只能用来判断两个对象是否属于实例关系， 而不能判断一个对象实例具体属于哪种类型。 

Array.isArray()

针对数组的这个问题，ES5 提供了 Array.isArray() 方法 。该方法用以确认某个对象本身是否为 Array 类型，而不区分该对象在哪个环境中创建。
Array.isArray() 本质上检测的是对象的 [[Class]] 值，[[Class]] 是对象的一个内部属性，里面包含了对象的类型信息，其格式为 [object Xxx] ，Xxx 就是对应的具体类型 。对于数组而言，[[Class]] 的值就是 [object Array] 。

3. constructor

该种判断方式其实涉及到原型、构造函数和实例之间的关系，更深层次的讲解将放到后面的内容，下面只需要简单了解一下这三者关系即可。

在定义一个函数（构造函数）的时候，JS引擎会为其添加prototype原型，原型上有其对应的constructor属性指向该构造函数，从而原型和构造函数之间互相知道对方。当构造函数实例化的时候，会产生对应的实例，其实例可以访问对应原型上的constructor属性，这样该实例就可以了解到通过谁产生了自己，这样就可以在新对象产生之后了解其数据类型。

小试牛刀

const val1 = 1;
console.log(val1.constructor); // [Function: Number]
const val2 = 'abc';
console.log(val2.constructor); // [Function: String]
const val3 = true;
console.log(val3.constructor); // [Function: Boolean]

虽然该方法可以判断其数据类型，但存在两个缺点：

1. null 和 undefined 是无效的对象，因此是不会有 constructor 存在的，这两种类型的数据需要通过其他方式来判断。

2. 函数的 constructor 是不稳定的，这个主要体现在自定义对象上，当开发者重写 prototype 后，原有的 constructor 引用会丢失，constructor 会默认为 Object

4. toString()

toString() 是 Object 的原型方法，调用该方法，默认返回当前对象的 [[Class]] 。这是一个内部属性，其格式为[object Xxx] ，其中 Xxx 就是对象的类型。所以利用Object.prototype.toString()方法可以对变量的类型进行比较准确的判断。该类型针对不同不同变量的类型返回的结果如下所示：

数据类型	结果
Number	[object Number]
String	[object String]
Object	[object Object]
Array	[object Array]
Boolean	[object Boolean]
Function	[object Function]
Null	[object Null]
Undefined	[object Undefined]
Symbol	[object Symbol]

利用该方法很容易构建一个鉴型函数，代码如下所示：

function type(target) {
    const ret = typeof(target);
    const template = {
        "[object Array]": "array", 
        "[object Object]":"object",
        "[object Number]":"number - object",
        "[object Boolean]":"boolean - object",
        "[object String]":'string-object'
    }
    if(target === null) {
        return 'null';
    }
    else if(ret == "object"){
        const str = Object.prototype.toString.call(target);
        return template[str];
    }
    else{
        return ret;
    }
}

console.log(type({})); // object
console.log(type(123)); // number
console.log(type('123')); // string