详解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 showModalDialog模态对话框使用说明
Dec 31 Javascript
javascript与webservice的通信实现代码
Dec 25 Javascript
原生js 秒表实现代码
Jul 24 Javascript
jquery鼠标滑过提示title具体实现代码
Aug 06 Javascript
sliderToggle在写jquery的计时器setTimeouter中不生效
May 26 Javascript
jQuery实现菜单式图片滑动切换
Mar 14 Javascript
Bootstrap登陆注册页面开发教程
Jul 12 Javascript
使用HTML5+Boostrap打造简单的音乐播放器
Aug 05 Javascript
vue+element实现表格新增、编辑、删除功能
May 28 Javascript
vue css 引入asstes中的图片无法显示的四种解决方法
Mar 16 Javascript
javascript实现滚动条效果
Mar 24 Javascript
jQuery 常用特效实例小结【显示与隐藏、淡入淡出、滑动、动画等】
May 19 jQuery
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
WinXP + Apache +PHP5 + MySQL + phpMyAdmin安装全功略
2006/07/09 PHP
不用数据库的多用户文件自由上传投票系统(2)
2006/10/09 PHP
PHP imagecreatefrombmp 从BMP文件或URL新建一图像
2012/07/16 PHP
mac os快速切换多个PHP版本的方法
2017/03/07 PHP
Javascript和HTML5利用canvas构建Web五子棋游戏实现算法
2013/07/17 Javascript
原生js做的手风琴效果的导航菜单
2013/11/08 Javascript
js 左右悬浮对联广告代码示例
2014/12/12 Javascript
JavaScript学习笔记之JS对象
2015/01/22 Javascript
AngularJS iframe跨域打开内容时报错误的解决办法
2015/01/26 Javascript
用JavaScript判断CSS浏览器类型前缀的两种方法
2015/10/08 Javascript
JavaScript接口的实现三种方式(推荐)
2016/06/14 Javascript
js 颜色选择插件
2017/01/23 Javascript
深入理解js中的加载事件
2017/02/08 Javascript
js鼠标移动时禁止选中文字
2017/02/19 Javascript
为JQuery EasyUI 表单组件增加焦点切换功能的方法
2017/04/13 jQuery
微信小程序分页加载的实例代码
2017/07/11 Javascript
详解React Native 屏幕适配(炒鸡简单的方法)
2018/06/11 Javascript
在js代码拼接dom对象到页面上的模板总结
2018/10/21 Javascript
深入解析ES6中的promise
2018/11/08 Javascript
Vue从TodoList中学父子组件通信
2019/02/05 Javascript
vue里如何主动销毁keep-alive缓存的组件
2019/03/21 Javascript
prettier自动格式化去换行的实现代码
2020/08/25 Javascript
Python3搜索及替换文件中文本的方法
2015/05/22 Python
python先序遍历二叉树问题
2017/11/10 Python
微信跳一跳python辅助脚本(总结)
2018/01/11 Python
Django开发中复选框用法示例
2018/03/20 Python
写一个方法,输入一个文件名和一个字符串,统计这个字符串在这个文件中出现的次数
2016/04/13 面试题
工程师自我评价怎么写
2013/09/19 职场文书
中级会计职业生涯规划范文
2014/01/16 职场文书
区域销售主管岗位职责
2014/06/15 职场文书
城管执法人员纪律作风整顿思想汇报
2014/09/13 职场文书
结婚保证书(三从四德)
2015/02/26 职场文书
员工辞职信范文
2015/03/02 职场文书
浅谈Python实现opencv之图片色素的数值运算和逻辑运算
2021/06/23 Python
如何利用Python实现n*n螺旋矩阵
2022/01/18 Python
Python使用plt.boxplot()函数绘制箱图、常用方法以及含义详解
2022/08/14 Python