详解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解密入门之凭直觉解
Jun 25 Javascript
ff chrome和ie下全局动态定位的异同及全局高度的取法
Jun 30 Javascript
javascript中clipboardData对象用法详解
May 13 Javascript
Javascript编程中几种继承方式比较分析
Nov 28 Javascript
js实现的页面矩阵图形变换特效
Jan 26 Javascript
Bootstrap基本组件学习笔记之input输入框组(9)
Dec 07 Javascript
JS瀑布流实现方法实例分析
Dec 19 Javascript
jQuery获取选中单选按钮radio的值
Dec 27 Javascript
node.js入门学习之url模块
Feb 25 Javascript
layui prompt 设置允许空白提交的方法
Sep 24 Javascript
基于vue的video播放器的实现示例
Feb 19 Vue.js
Vue.js中v-bind指令的用法介绍
Mar 13 Vue.js
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
一条久听不愿放下的DIY森海MX500,三言两语话神奇
2021/03/02 无线电
基于php split()函数的用法详解
2013/06/05 PHP
PHP+redis实现的悲观锁机制示例
2018/06/12 PHP
破解Session cookie的方法
2006/07/28 Javascript
Javascript实例教程(19) 使用HoTMetal(3)
2006/12/23 Javascript
JavaScript判断DOM何时加载完毕的技巧
2012/11/11 Javascript
javascript判断机器是否联网的2种方法
2013/08/09 Javascript
Bootstrap3 内联单选和多选框
2016/12/29 Javascript
jquery使用EasyUI Tree异步加载JSON数据(生成树)
2017/02/11 Javascript
Angularjs 1.3 中的$parse实例代码
2017/09/14 Javascript
vue-awesome-swiper 基于vue实现h5滑动翻页效果【推荐】
2018/11/08 Javascript
ant-design-vue按需加载的坑的解决
2020/05/14 Javascript
Vue按时间段查询数据组件使用详解
2020/08/21 Javascript
Vue自定义组件双向绑定实现原理及方法详解
2020/09/03 Javascript
python读取oracle函数返回值
2016/07/18 Python
详解python之简单主机批量管理工具
2017/01/27 Python
利用Django内置的认证视图实现用户密码重置功能详解
2017/11/24 Python
python如何求解两数的最大公约数
2018/09/27 Python
python字符串替换第一个字符串的方法
2019/06/26 Python
python3.8与pyinstaller冲突问题的快速解决方法
2020/01/16 Python
python自动下载图片的方法示例
2020/03/25 Python
Python gevent协程切换实现详解
2020/09/14 Python
python 用opencv实现霍夫线变换
2020/11/27 Python
美国庭院家具购物网站:AlphaMarts
2019/04/10 全球购物
Hanky Panky官方网站:内衣和睡衣
2019/07/25 全球购物
戛纳奢侈品商店:Jacques Loup法国
2019/11/04 全球购物
世界上最伟大的马产品:Equiderma
2020/01/07 全球购物
当x.equals(y)等于true时,x.hashCode()与y.hashCode()可以不相等,这句话对不对
2015/05/02 面试题
事业单位个人应聘自荐信
2013/09/21 职场文书
自荐信怎么写好
2013/11/11 职场文书
体育教育专业毕业生自荐信
2013/11/15 职场文书
闭幕式主持词
2014/04/02 职场文书
谢师宴邀请函
2015/02/02 职场文书
寒假社会实践个人总结
2015/03/06 职场文书
大学生就业指导课心得体会
2016/01/15 职场文书
解决Golang中ResponseWriter的一个坑
2021/04/27 Golang