详解JavaScript中的4种类型识别方法

更新时间：2015年09月14日 11:06:50 作者：小火柴的蓝色理想

JavaScript中检测对象类型的运算符有：typeof、instanceof，还有对象的constructor属性： 1) typeof 运算符 typeof 是一元运算符，返回结果是一个说明运算数类型的字符串。下面由小编给大家分享JavaScript中的4种类型识别方法，需要的朋友可以参考下本文

具体内容如下：

1.typeof

　　【输出】首字母小写的字符串形式

　　【功能】

　　　　[a]可以识别标准类型(将Null识别为object)
　　　　[b]不能识别具体的对象类型(Function除外)

　　【实例】

console.log(typeof "jerry");//"string"
console.log(typeof 12);//"number"
console.log(typeof true);//"boolean"
console.log(typeof undefined);//"undefined"
console.log(typeof null);//"object"
console.log(typeof {name: "jerry"});//"object"
console.log(typeof function(){});//"function"
console.log(typeof []);//"object"
console.log(typeof new Date);//"object"
console.log(typeof /\d/);//"object"
function Person(){};
console.log(typeof new Person);//"object"

2.Object.prototype.toString

　　【输出】[object 数据类型]的字符串形式

　　【功能】

　　　　[a]可以识别标准类型及内置对象类型
　　　　[b]不能识别自定义类型

　　【构造方法】

function type(obj){
　　return Object.prototype.toString.call(obj).slice(8,-1).toLowerCase();
}

　　【实例1】

console.log(Object.prototype.toString.call("jerry"));//[object String]
console.log(Object.prototype.toString.call(12));//[object Number]
console.log(Object.prototype.toString.call(true));//[object Boolean]
console.log(Object.prototype.toString.call(undefined));//[object Undefined]
console.log(Object.prototype.toString.call(null));//[object Null]
console.log(Object.prototype.toString.call({name: "jerry"}));//[object Object]
console.log(Object.prototype.toString.call(function(){}));//[object Function]
console.log(Object.prototype.toString.call([]));//[object Array]
console.log(Object.prototype.toString.call(new Date));//[object Date]
console.log(Object.prototype.toString.call(/\d/));//[object RegExp]
function Person(){};
console.log(Object.prototype.toString.call(new Person));//[object Object]

　　【实例2】

function type(obj){
  return Object.prototype.toString.call(obj).slice(8,-1).toLowerCase();
}
console.log(type("jerry"));//"string"
console.log(type(12));//"number"
console.log(type(true));//"boolean"
console.log(type(undefined));//"undefined"
console.log(type(null));//"null"
console.log(type({name: "jerry"}));//"object"
console.log(type(function(){}));//"function"
console.log(type([]));//"array"
console.log(type(new Date));//"date"
console.log(type(/\d/));//"regexp"
function Person(){};
console.log(type(new Person));//"object"

3.constructor

　　【输出】function 数据类型(){[native code]}或者function 自定义类型(){}

　　【功能】

　　　　[a]可以识别标准类型、内置对象类型及自定义类型
　　　　[b]不能识别undefined、null，会报错

　　【构造方法】

function type(obj){
  var temp = obj.constructor.toString();
  return temp.replace(/^function (\w+)\(\).+$/,'$1');
}

　　【实例1】

console.log(("jerry").constructor);//function String(){[native code]}
console.log((12).constructor);//function Number(){[native code]}
console.log((true).constructor);//function Boolean(){[native code]}
//console.log((undefined).constructor);//报错
//console.log((null).constructor);//报错
console.log(({name: "jerry"}).constructor);//function Object(){[native code]}
console.log((function(){}).constructor);//function Function(){[native code]}
console.log(([]).constructor);//function Array(){[native code]}
console.log((new Date).constructor);//function Date(){[native code]}
console.log((/\d/).constructor);//function RegExp(){[native code]}
function Person(){};
console.log((new Person).constructor);//function Person(){}

　　【实例2】

function type(obj){
  var temp = obj.constructor.toString().toLowerCase();
  return temp.replace(/^function (\w+)\(\).+$/,'$1');
}
console.log(type("jerry"));//"string"
console.log(type(12));//"number"
console.log(type(true));//"boolean"
//console.log(type(undefined));//错误
//console.log(type(null));//错误
console.log(type({name: "jerry"}));//"object"
console.log(type(function(){}));//"function"
console.log(type([]));//"array"
console.log(type(new Date));//"date"
console.log(type(/\d/));//"regexp"
function Person(){};
console.log(type(new Person));//"person"

4.instanceof

　　【输出】true或false

　　【功能】

　　　　[a]可以识别内置对象类型、自定义类型及其父类型
　　　　[b]不能识别标准类型,会返回false
　　　　[c]不能识别undefined、null，会报错

　　【实例】

console.log("jerry" instanceof String);//false
console.log(12 instanceof Number);//false
console.log(true instanceof Boolean);//false
//console.log(undefined instanceof Undefined);//报错
//console.log(null instanceof Null);//报错
console.log({name: "jerry"} instanceof Object);//true
console.log(function(){} instanceof Function);//true
console.log([] instanceof Array);//true
console.log(new Date instanceof Date);//true
console.log(/\d/ instanceof RegExp);//true
function Person(){};
console.log(new Person instanceof Person);//true
console.log(new Person instanceof Object);//true

以上内容就是详解JavaScript中的4种类型识别方法，希望大家喜欢。

您可能感兴趣的文章:

Node.js静态文件服务器改进版

详解CocosCreator消息分发机制
这篇文章主要介绍了详解CocosCreator消息分发机制，详细介绍了各模块的设计，同学们一定要自己看下
2021-04-04
JavaScript写的一个自定义弹出式对话框代码
最近闲来无事，用js自己做了一个弹出式对话框，需要应用弹出式对话框的朋友可以参考下。
2010-01-01
js 进度条实现代码
非常简洁的进度条实现代码，一般用于一些比较耗时间的操作。
2009-05-05
JS+CSS实现随机点名(实例代码)
本文通过js html和cass代码实现了随机点名效果，代码简单易懂，非常不错，具有一定的参考借鉴价值，需要的朋友参考下吧
2019-11-11
JavaScript使用promise处理多重复请求
处理重复请求的文章想必大家也看过了很多，大多数都是分为在response返回之前发现重复请求就return掉的和使用节流/防抖来间接规避用户频繁操作两种版本的。本文主要介绍了JavaScript使用promise处理多重复请求，感兴趣的可以了解一下
2021-05-05
JavaScript 更严格的相等 [译]
大部分JavaScript程序员都知道:应该使用严格相等(===)来代替“普通”的相等操作(==).但是,有时候你的确需要一个比严格相等===更严格的运算符,比如说:在你想检查某个值是否是NaN的时候,又或者你想区分-0和+0的时候.本文解释了相关的知识以及ECMAScript.next中的解决办法:“is”操作符
2012-09-09
javascript入门基础之私有变量
开始接触这门语言时，可能都会觉得这门语言缺少访问控制符(如public、private、protected)，从而导致不能定义私有变量和私有方法。但经过进一步了解就会知道javascript同样可以有私有变量。
2010-02-02
JavaScript中常用的数组过滤方法例子
这篇文章主要给大家介绍了关于JavaScript中常用的数组过滤方法的相关资料,数组过滤器方法是JavaScript中使用最广泛的方法之一,它允许我们快速过滤出具有特定条件的数组中的元素,需要的朋友可以参考下
2023-11-11
layui给下拉框、按钮状态、时间赋初始值的方法
今天小编就为大家分享一篇layui给下拉框、按钮状态、时间赋初始值的方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2019-09-09
关于javascript的一些知识以及循环详解
下面小编就为大家带来一篇关于javascript的一些知识以及循环详解。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2016-09-09