typeof检测数据类型?no no no

在学习数据类型的时候,我们经常会用到一个方法来检测数据类型。那么大家最熟悉的是什么方法呢?看看小白咋说:

用typeof的方式大家都很熟悉,但我们知道如果用typeof来检查复杂数据类型,就会出现object,比如数组吧。

vararr= [1,2,3];

console.log(typeofarr);//object

在 JavaScript 里使用 typeof来判断数据类型,只能区分基本类型,即 “number”,”string”,”undefined”,”boolean”,”object”五种。对于数组、函数、对象来说,其关系错综复杂,使用 typeof 都会统一返回 “object” 字符串。要想区别对象、数组、函数单纯使用 typeof 是不行的。

那我们根本无法区分其他的类型,就以数组为例,看看还有没有更好的方法来检测数组类型,当然也可以检测其他的复杂数据类型。

1

检测对象数据类型 instanceof

vararr= [1,2,3];

console.log(arrinstanceofArray);//true

用这种方法,检测出了数组,需要注意的是Array首字母一定要大写。

2

检测对象数据类型 constructor

vararr= [1,2,3];

console.log(arr.constructor=== Array);//true

用这种方法,同样也可以检测出了数组,但感觉就稍微麻烦一些。

以上这两种是不是就可以搞定了?no no no 因为以上两种检测方式有共同的缺点,在一个网页中嵌套了多个网页iframe,或者多个全局环境时,可能会出现错误。

3

检测数组方法(ECMAScript5新增方法)Array.isArray

vararr= [1,2,3];

console.log(Array.isArray(arr));//true

这种方法貌似好了很多,但是它也存在弊端,就是低版本浏览器不兼容,IE9以上才兼容。

4

这时我们需要一个更加精准的方式

vararr= [1,2,3];

console.log(

Object.prototype.toString.call(arr));

//[object Array]

console.log(

Object.prototype.toString.call(arr)

=='[object Array]');//true

console.log(

Object.prototype.toString.apply(arr));

//[object Array]

console.log(

Object.prototype.toString.apply(arr)

=='[object Array]');

//true

因为太长在公众号里会被截掉,所以换行了,大家可以拷贝出来再格式化一下。

这两种方式比较精准一些,那么call() apply()这两种方法有什么区别呢?对检测数据类型来说没什么区别,但是着两个方法在其他用途上还是有一定区别的。在这篇文章中不是重点。

那么,代码比较长,用起来不方便。我们可以把它放在一个函数中,通过传参的方式来验证。

其实,只要在ES5的环境内Array.isArray方法也是很不错的,但如果isArray方法被改写或者低版本浏览器,就没办法了还是要用很长的方法。不过我们可以通过typeof来判断一下Array.isArray是否是一个函数,如何它的数据类型是一个函数的话,就一定在ES5的环境内。当然我们也可以自己封装一个小函数来验证。大家自己试一试吧!

鸣谢

感谢在特定时间提醒我发公众号的以下同学:

@宇

@...

@瑞 "

本微信号所有内容为前端客用户原创,前端客已获得独家授权,欢迎分享。

如有转载需求请留言征询,对于未经许可私自篡改内容、转载的行为我们保留追究维权的合法权利!

  • 发表于:
  • 原文链接http://kuaibao.qq.com/s/20180122G09QG600?refer=cp_1026
  • 腾讯「云+社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 yunjia_community@tencent.com 删除。

扫码关注云+社区

领取腾讯云代金券