详解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高级程序设计
Dec 29 Javascript
jQuery中的bind绑定事件与文本框改变事件的临时解决方法
Aug 13 Javascript
Jquery读取URL参数小例子
Aug 30 Javascript
减少访问DOM的次数提升javascript性能
Feb 24 Javascript
JS常用表单验证方法总结
May 22 Javascript
原生js封装的一些jquery方法(详解)
Sep 20 Javascript
基于jQuery使用Ajax动态执行模糊查询功能
Jul 05 jQuery
简化版的vue-router实现思路详解
Oct 19 Javascript
Vue.js中的extend绑定节点并显示的方法
Jun 20 Javascript
vue 更改连接后台的api示例
Nov 11 Javascript
在vue中使用防抖函数组件操作
Jul 26 Javascript
Vue2.0 $set()的正确使用详解
Jul 28 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的ob缓存机制实现页面静态化方法
2017/07/09 PHP
php实现与python进行socket通信的方法示例
2017/08/30 PHP
PHP性能分析工具xhprof的安装使用与注意事项
2017/12/19 PHP
PHP实现的最大正向匹配算法示例
2017/12/19 PHP
jQuery1.6 正式版发布并提供下载
2011/05/05 Javascript
js触发asp.net的Button的Onclick事件应用
2013/02/02 Javascript
正负小数点后两位浮点数实现原理及代码
2013/09/06 Javascript
用js闭包的方法实现多点标注冒泡示例
2014/05/29 Javascript
Node.js抓取中文网页乱码问题和解决方法
2015/02/10 Javascript
详谈javascript中DOM的基本属性
2015/02/26 Javascript
jQuery移动页面开发中的触摸事件与虚拟鼠标事件简介
2015/12/03 Javascript
基于BootStrap Metronic开发框架经验小结【一】框架总览及菜单模块的处理
2016/05/12 Javascript
jQuery实现调整表格单列顺序完整实例
2016/06/20 Javascript
JS点击某个图标或按钮弹出文件选择框的实现代码
2016/09/27 Javascript
React+Webpack快速上手指南(小结)
2018/08/15 Javascript
Vue中jsx不完全应用指南小结
2019/11/01 Javascript
python学习手册中的python多态示例代码
2014/01/21 Python
学习Python selenium自动化网页抓取器
2018/01/20 Python
pandas 获取季度,月度,年度首尾日期的方法
2018/04/11 Python
详解python数据结构和算法
2019/04/18 Python
Python中Numpy mat的使用详解
2019/05/24 Python
pandas.read_csv参数详解(小结)
2019/06/21 Python
在tensorflow中实现屏蔽输出的log信息
2020/02/04 Python
Python装饰器结合递归原理解析
2020/07/02 Python
html5 Web SQL Database 之事务处理函数transaction与executeSQL解析
2013/11/07 HTML / CSS
美国运动鞋和运动服零售商:Footaction
2017/04/07 全球购物
美国奢侈品购物平台:Orchard Mile
2018/05/02 全球购物
Hotels.com拉丁美洲:从豪华酒店到经济型酒店的预定优惠和折扣
2019/12/09 全球购物
.NET面试题:什么是反射
2016/09/30 面试题
商学院大学生求职的自我评价
2014/03/12 职场文书
新春文艺演出主持词
2014/03/27 职场文书
倡议书的写法
2014/08/30 职场文书
就业协议书范本
2014/10/08 职场文书
党员个人批评与自我批评
2014/10/14 职场文书
2016年社区服务活动总结
2016/04/06 职场文书
Python爬虫之爬取最新更新的小说网站
2021/05/06 Python