JS 如何判断数据类型
在 JS 中有许多中提供了几个原生的判断数据类型方法,本文主要介绍 JS 中的判断基本数据类型的四个方法:
typeof, instanceof, constructor, prototype
typeof
相信用 JS 的都肯定用过 typeof
来判断一些基本类型,但可能很多人都会误以为 typeof
是一个函数。
实际上 typeof
并不是一个函数,也不是一个语句,而是一个一元运算符(就像 ++, –, !)。
因为一元运算符是可以用括号将运算数包裹起来的,所以让看起来非常想一个函数,如 !(condition)
接下来回到正题,用 typeof
可以判断哪几种基本的数据类型呢
使用 typeof
判断后返回的是 字符串 类型
- string 如果这个值是字符串
- number 如果这个值是数值
- boolean 如果这个值是布尔值
- function 如果这个值是函数
- object 如果这个值是对象、数组或 null
- undefined 如果这个值未定义
可以看到 typeof
并不能单独的判断出数组,而是将其判断成对象。当然你可以使用 Array.isArray(ob)
来继续对 Object 进行数组的判断
console.log(typeof 1 === 'number') // => true
console.log(typeof 'wjh' === 'string') // => true
console.log(typeof false === 'boolean') // => true
console.log(typeof [] === 'object') // => true
console.log(typeof {} === 'object') // => true
console.log(typeof null === 'object') // => true
console.log(typeof un === 'undefined') // => true
instanceof
instanceof
运算符用来判断一个构造函数的 prototype 属性所指向的对象是否存在另外一个要检测对象的原型链上,需要区分大小写。( instanceof 不是函数,是一个双目运算符如 +, -… )
需要注意的是,instanceof 只能用来判断对象和函数,不能用来判断字符串和数字等。判断它是否为字符串和数字时,只会返回false。
var arr = []
var obj = {}
var func = functino () { console.log('Hello world') }
console.log(arr instanceof Array) // => true
console.log(obj instanceof Object) // => true
console.log(func instanceof Function) // => true
console.log(1 instanceof Number) // => false
console.log('str' instanceof String) // => false
constructor
在 Javascript 中每一个具有原型的对象都拥有一个 constructor
属性 (Object.constructor)
constructor
属性返回对创建此对象的数组函数的引用。
constructor
可以判断所有类型,包括 Array
// String
var str = "字符串"
console.log(str.constructor) // function String() { [native code] }
console.log(str.constructor === String) // true
// Array
var arr = [1, 2, 3]
console.log(arr.constructor) // function Array() { [native code] }
console.log(arr.constructor === Array) // true
// Number
var num = 5;
console.log(num.constructor) // function Number() { [native code] }
console.log(num.constructor === Number) // true
// Object
var obj = {};
console.log(obj.constructor) // function Object() { [native code] }
console.log(obj.constructor === Object) // tru
但是, constructor在类继承时会出错
function A(){};
function B(){};
var aObj = new A();
console.log(aObj.constructor === A); //true;
console.log(aObj.constructor === B); //false;
function C(){};
function D(){};
C.prototype = new D(); //C继承自D
var cObj = new C();
console.log(cObj.constructor === C); //false;
console.log(cObj.constructor === D); //true;
prototype
以上三种方法多少都会有一些不能判断的情况。为了保证兼容性,可以通过 Object.prototype.toString
方法,判断某个对象值属于哪种内置类型。
- 需要注意大小写
console.log(Object.prototype.toString.call('字符串') === '[object String]') // -------> true;
console.log(Object.prototype.toString.call(123) === '[object Number]') // -------> true;
console.log(Object.prototype.toString.call([1,2,3]) === '[object Array]') // -------> true;
console.log(Object.prototype.toString.call(new Date()) === '[object Date]') // -------> true;
console.log(Object.prototype.toString.call(function a(){}) === '[object Function]') // -------> true;
console.log(Object.prototype.toString.call({}) === '[object Object]') // -------> true;