JS四种数据类型判断：typeof、instanceof、constructor与toString详解

1、typeof

本文归纳了四种判断手段：

1、typeof

typeof属于运算符，具备两种用法：(1)typeof(表达式); (2)typeof 变量名;结果返回字符串，用于标识变量的数据类型;因此可借此判定number, string, object, boolean, function, undefined, symbol 这七种类型，各类情形返回内容见下表：

1、typeof


// 字符串 
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

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

3、constructor

此判断方式涉及原型、构造函数与实例间的关联，深入解析将置于后续章节，此处仅需简要知晓三者关系。

1、typeof

定义函数(构造函数)时，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]

尽管该方法能判断数据类型，但存在两点不足：

null 与 undefined 为无效对象，故不存在 constructor ，这两种类型需借助其他手段判断。
函数的 constructor 具有不稳定性，主要体现在自定义对象上。若开发者重写 prototype ，原有的 constructor 引用将丢失，constructor 将默认为 Object

4、toString()

toString() 作为 Object 的原型方法，调用时默认返回当前对象的 [[Class]] 。此为内部属性，格式遵循[object Xxx] ，其中 Xxx 代表对象类型。因此借助Object.prototype.toString()方法可对变量类型进行较为精确的判断。

该方式针对不同变量类型返回结果如下：

1、typeof

利用此方法可轻松构建鉴型函数，代码示例如下：


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

至此，关于JS中四种数据类型判断方法的文章介绍完毕，更多相关JS数据类型判断内容请参阅本站往期文章或继续阅读下文，感谢大家的支持！

JavaScript中四种数据类型判断方法的原理与局限

1、typeof

2、instanceof

3、constructor

4、toString()

实用工具推荐