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


Posted in Javascript onSeptember 14, 2015

具体内容如下:

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种类型识别方法,希望大家喜欢。

Javascript 相关文章推荐
javascript this用法小结
Dec 19 Javascript
jquery 问答知识整理
Feb 11 Javascript
用JavaScript对JSON进行模式匹配 (Part 2 - 实现)
Jul 17 Javascript
extjs tabpanel限制选项卡数量实现思路及代码
Apr 02 Javascript
jquery实现树形二级菜单实例代码
Nov 20 Javascript
基于javascript实现右下角浮动广告效果
Jan 08 Javascript
vue高德地图之玩转周边
Jun 16 Javascript
使用vue构建一个上传图片表单
Jul 04 Javascript
Vue中正确使用jQuery的方法
Oct 30 jQuery
傻瓜式解读koa中间件处理模块koa-compose的使用
Oct 30 Javascript
Vue中fragment.js使用方法小结
Feb 17 Javascript
vue 微信分享回调iOS和安卓回调出现错误的解决
Sep 07 Javascript
jquery实现鼠标点击后展开列表内容的导航栏效果
Sep 14 #Javascript
IE中document.createElement的iframe无法设置属性name的解决方法
Sep 14 #Javascript
js动态生成Html元素实现Post操作(createElement)
Sep 14 #Javascript
IE9+已经不对document.createElement向下兼容的解决方法
Sep 14 #Javascript
JS动态添加iframe的代码
Sep 14 #Javascript
javascript实现在指定元素中垂直水平居中
Sep 13 #Javascript
window.onload使用指南
Sep 13 #Javascript
You might like
如何在symfony中导出为CSV文件中的数据
2011/10/06 PHP
MySQL 日期时间函数常用总结
2012/06/12 PHP
php实现对两个数组进行减法操作的方法
2015/04/17 PHP
php计算整个目录大小的方法
2015/06/01 PHP
php实现概率性随机抽奖代码
2016/01/02 PHP
在php的yii2框架中整合hbase库的方法
2018/09/20 PHP
php array_chunk()函数用法与注意事项
2019/07/12 PHP
JavaScript Event学习第七章 事件属性
2010/02/07 Javascript
jQuery团购倒计时特效实现方法
2015/05/07 Javascript
基于javascript制作微信聊天面板
2020/08/09 Javascript
使用jQuery Mobile框架开发移动端Web App的入门教程
2016/05/17 Javascript
Jquery修改image的src属性,图片不加载问题的解决方法
2016/05/17 Javascript
详解Angular Reactive Form 表单验证
2017/07/06 Javascript
微信小程序多列选择器range-key使用详解
2020/03/30 Javascript
详解webpack babel的配置
2018/01/09 Javascript
微信小程序实现红包功能(后端PHP实现逻辑)
2018/07/11 Javascript
Vue瀑布流插件的使用示例
2018/09/19 Javascript
Vue注册组件命名时不能用大写的原因浅析
2019/04/25 Javascript
vue 使用高德地图vue-amap组件过程解析
2019/09/07 Javascript
Python实现从脚本里运行scrapy的方法
2015/04/07 Python
Python网络编程之TCP与UDP协议套接字用法示例
2018/02/02 Python
Python实现连接两个无规则列表后删除重复元素并升序排序的方法
2018/02/05 Python
在Qt中正确的设置窗体的背景图片的几种方法总结
2019/06/19 Python
Python中字符串List按照长度排序
2019/07/01 Python
Python 脚本拉取 Docker 镜像问题
2019/11/10 Python
简单了解python装饰器原理及使用方法
2019/12/18 Python
python Scrapy爬虫框架的使用
2021/01/21 Python
介绍一下游标
2012/01/10 面试题
办公室保洁员岗位职责
2013/12/02 职场文书
音乐幼师求职信
2014/07/09 职场文书
2015年乡镇信访工作总结
2015/04/07 职场文书
党员干部公开承诺书范文
2015/04/27 职场文书
班主任寄语2016
2015/12/04 职场文书
三年级作文之趣事作文
2019/11/04 职场文书
六种css3实现的边框过渡效果
2021/04/22 HTML / CSS
Mysql开启外网访问
2022/05/15 MySQL