详解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 相关文章推荐
JS重要知识点小结
Nov 06 Javascript
学习从实践开始之jQuery插件开发 菜单插件开发
May 03 Javascript
jQuery 获取和设置select下拉框的值实现代码
Nov 08 Javascript
JS基于Mootools实现的个性菜单效果代码
Oct 21 Javascript
JavaScrip常见的一些算法总结
Dec 28 Javascript
jquery ajax结合thinkphp的getjson实现跨域的方法
Jun 06 Javascript
js实现获取鼠标当前的位置
Dec 14 Javascript
使用grunt合并压缩js和css文件的方法
Mar 02 Javascript
jQuery基于事件控制实现点击显示内容下拉效果
Mar 07 Javascript
Vue中组件之间数据的传递的示例代码
Sep 08 Javascript
详解微信小程序调起键盘性能优化
Jul 24 Javascript
vue实现员工信息录入功能
Jun 11 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
PHP简单实现数字分页功能示例
2016/08/24 PHP
php使用fputcsv实现大数据的导出操作详解
2020/02/27 PHP
TP5框架使用QueryList采集框架爬小说操作示例
2020/03/26 PHP
js 获取屏幕各种宽高的方法(浏览器兼容)
2013/05/15 Javascript
EXTjs4.0的store的findRecord的BUG演示代码
2013/06/08 Javascript
jQuery子元素过滤选择器用法示例
2016/09/09 Javascript
AngularJS的$location使用方法详解
2017/10/19 Javascript
Node.js利用console输出日志文件的方法示例
2018/04/27 Javascript
Vue使用vux-ui自定义表单验证遇到的问题及解决方法
2018/05/10 Javascript
Vue表单输入绑定的示例代码
2018/11/01 Javascript
13 个npm 快速开发技巧(推荐)
2019/07/04 Javascript
vue获取data数据改变前后的值方法
2019/11/07 Javascript
JavaScript实现弹出窗口效果
2020/12/09 Javascript
原生JS实现拖拽功能
2020/12/16 Javascript
[00:58]他们到底在电话里听到了什么?
2017/11/21 DOTA
[01:01:31]2018DOTA2亚洲邀请赛3月29日小组赛B组 Mineski VS paiN
2018/03/30 DOTA
[50:38]DOTA2-DPC中国联赛 正赛 Phoenix vs CDEC BO3 第二场 3月7日
2021/03/11 DOTA
Python异常处理总结
2014/08/15 Python
Django框架中的对象列表视图使用示例
2015/07/21 Python
Python中如何优雅的合并两个字典(dict)方法示例
2017/08/09 Python
python3.6+django2.0开发一套学员管理系统
2018/03/03 Python
Django Admin中增加导出Excel功能过程解析
2019/09/04 Python
python3多线程知识点总结
2019/09/26 Python
Python for i in range ()用法详解
2020/09/18 Python
Python中私有属性的定义方式
2020/03/05 Python
Python生成器常见问题及解决方案
2020/03/21 Python
python+requests接口自动化框架的实现
2020/08/31 Python
opencv+pyQt5实现图片阈值编辑器/寻色块阈值利器
2020/11/13 Python
美国最大的户外装备和服装购物网站:Backcountry
2019/10/15 全球购物
电子商务专业毕业生自荐书
2014/06/22 职场文书
高中社区服务活动报告
2015/02/05 职场文书
2015年话务员工作总结
2015/04/29 职场文书
优秀教师主要事迹材料
2015/11/04 职场文书
pytorch 使用半精度模型部署的操作
2021/05/24 Python
浅谈tf.train.Saver()与tf.train.import_meta_graph的要点
2021/05/26 Python
浅谈Python中的正则表达式
2021/06/28 Python