js中判断对象数据类型的方法
方法一：采用typeof
let fn = function(n){
console.log(n);
}
let str = 'string';
let arr = [1,2,3];
let obj = {
a:123,
b:456
};
let num = 1;
let b = true;
let n = null;
let u = undefined;
//方法一使用typeof方法。
console.log(typeof str);//string
console.log(typeof arr);//object
console.log(typeof obj);//object
console.log(typeof num);//number
console.log(typeof b);//boolean
console.log(typeof n);//null是一个空的对象
console.log(typeof u);//undefined
console.log(typeof fn);//function
通过上面的检测我们发现typeof检测的Array和Object的返回类型都是Object，因此用typeof是无法检测出来数组和对象的。
方法二：instanceof
let o = {
'name':'lee'
};
let a = ['reg', 'blue'];
console.log(o instanceof Object);// true
console.log(a instanceof Array);// true
console.log(o instanceof Array);// false
注意：instaceof只可以用来判断数组和对象，不能判断string和boolean类型，要判断string和boolean类型需要采用方法四。
由于数组也属于对象因此我们使用instanceof判断一个数组是否为对象的时候结果也会是true。如：
console.log(a instanceof Object);//true。
下面封装一个方法进行改进：
let o = {
'name': 'lee'
};
let a = ['reg', 'blue'];
let getDataType = function(o) {
if(o instanceof Array) {
return 'Array';
}else if( o instanceof Object ) {
return 'Object';
}else{
return 'param is no object type';
}
};
console.log(getDataType(o));//Object。
console.log(getDataType(a));//Array。
方法三：使用constructor方法
let o = {
'name': 'lee'
};
let a = ['reg', 'blue'];
console.log(o.constructor == Object);//true
console.log(a.constructor == Array);//true
可以看出constructor可以区分Array和Object。
let n=true;
n.constructor==Boolean //true
let num=1;
num.constructor==Number //true
let str='hello world';
str.constructor==String //true
let num=new Number();
num.constructor==Number //true
不过要注意，constructor属性是可以被修改的，会导致检测出的结果不正确
function Person(){
}
function Student(){
}
Student.prototype = new Person();
let John = new Student();
console.log(John.constructor==Student); // false
console.log(John.constructor==Person); // true
除了undefined和null，其他类型的变量均能使用constructor判断出类型。
方法四：Object.prototype.toString.call() ，这个方法是最佳的方案
Object.prototype.toString.call(123)
//"[object Number]"
Object.prototype.toString.call('str')
//"[object String]"
Object.prototype.toString.call(true)
//"[object Boolean]"
Object.prototype.toString.call({})
//"[object Object]"
Object.prototype.toString.call([])
//"[object Array]"
// 封装一个方法判断数组和对象
function isType(obj){
var type = Object.prototype.toString.call(obj);
if(type == '[object Array]'){
return 'Array';
}else if(type == '[object Object]'){
return "Object"
}else{
return 'param is no object type';
}
}
console.log(isType(o));//Object
console.log(isType(a));//Array
// 下面是更简洁的封装，来自vue源码
var _toString = Object.prototype.toString;
function toRawType (value) {return _toString.call(value).slice(8, -1)} // 从第8位开始（不包括第8位）到数组结尾处
Object.prototype.toString方法的在被调用的时候，会执行如下的操作步骤：
获取对象的类名（对象类型）。
[[Class]]是一个内部属性,所有的对象(原生对象和宿主对象)都拥有该属性。在规范中，[[Class]]是这么定义的:
内部属性，[[Class]] 一个字符串值，表明了该对象的类型。
然后将[object 获取的对象类型的名]组合为字符串 。
返回字符串 “[object Array]” 。
经典前端面试题每日更新，欢迎参与讨论，地址：https://github.com/daily-interview/fe-interview。
更多angular1/2/4/5、ionic1/2/3、react、vue、微信小程序、nodejs等技术文章、视频教程和开源项目，请关注微信公众号——全栈弄潮儿。
微信公众号
发表评论 (审核通过后显示评论)：