用Object.prototype.toString.call(obj)检测对象类型原因分析


Posted in Javascript onOctober 11, 2018

这是一个十分常见的问题,用 typeof 是否能准确判断一个对象变量,答案是否定的,null 的结果也是 object,Array 的结果也是 object,有时候我们需要的是 "纯粹" 的 object 对象。如何避免呢?比较好的方式是:

console.log(Object.prototype.toString.call(obj) === "[object Object]");

使用以上方式可以很好的区分各种类型:

(无法区分自定义对象类型,自定义类型可以采用instanceof区分)

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]

为什么这样就能区分呢?于是我去看了一下toString方法的用法:toString方法返回反映这个对象的字符串。

那为什么不直接用obj.toString()呢?

console.log("jerry".toString());//jerry
console.log((1).toString());//1
console.log([1,2].toString());//1,2
console.log(new Date().toString());//Wed Dec 21 2016 20:35:48 GMT+0800 (中国标准时间)
console.log(function(){}.toString());//function (){}
console.log(null.toString());//error
console.log(undefined.toString());//error

同样是检测对象obj调用toString方法(关于toString()方法的用法的可以参考toString的详解),obj.toString()的结果和Object.prototype.toString.call(obj)的结果不一样,这是为什么?

这是因为toString为Object的原型方法,而Array ,function等类型作为Object的实例,都重写了toString方法。不同的对象类型调用toString方法时,根据原型链的知识,调用的是对应的重写之后的toString方法(function类型返回内容为函数体的字符串,Array类型返回元素组成的字符串.....),而不会去调用Object上原型toString方法(返回对象的具体类型),所以采用obj.toString()不能得到其对象类型,只能将obj转换为字符串类型;因此,在想要得到对象的具体类型时,应该调用Object上原型toString方法。

我们可以验证一下,将数组的toString方法删除,看看会是什么结果:

var arr=[1,2,3];console.log(Array.prototype.hasOwnProperty("toString"));//true
console.log(arr.toString());//1,2,3
delete Array.prototype.toString;//delete操作符可以删除实例属性
console.log(Array.prototype.hasOwnProperty("toString"));//false
console.log(arr.toString());//"[object Array]"

删除了Array的toString方法后,同样再采用arr.toString()方法调用时,不再有屏蔽Object原型方法的实例方法,因此沿着原型链,arr最后调用了Object的toString方法,返回了和Object.prototype.toString.call(arr)相同的结果。

Javascript 相关文章推荐
javascript转换字符串为dom对象(字符串动态创建dom)
May 10 Javascript
jquery dialog键盘事件代码
Aug 01 Javascript
javascript五图轮播切换实用版
Aug 17 Javascript
JQuery中使用Ajax赋值给全局变量异常的解决方法
Jan 10 Javascript
深入浅析AngularJS中的module(模块)
Jan 04 Javascript
javascript类型系统 Array对象学习笔记
Jan 09 Javascript
快速实现JS图片懒加载(可视区域加载)示例代码
Jan 04 Javascript
jQury Ajax使用Token验证身份实例代码
Sep 22 Javascript
实现图片首尾平滑轮播(JS原生方法—节流)
Oct 17 Javascript
ajax前台后台跨域请求处理方式
Feb 08 Javascript
element实现合并单元格通用方法
Nov 13 Javascript
Angular进行简单单元测试的实现方法实例
Aug 16 Javascript
使用vue 国际化i18n 实现多实现语言切换功能
Oct 11 #Javascript
详解Angular5/Angular6项目如何添加热更新(HMR)功能
Oct 10 #Javascript
Node.js npm命令运行node.js脚本的方法
Oct 10 #Javascript
vue环形进度条组件实例应用
Oct 10 #Javascript
Node.js中读取TXT文件内容fs.readFile()用法
Oct 10 #Javascript
详解Node.js读写中文内容文件操作
Oct 10 #Javascript
angular6的响应式表单的实现
Oct 10 #Javascript
You might like
农民和部队如何穿矿
2020/03/04 星际争霸
ob_start(),ob_start('ob_gzhandler')使用
2006/12/25 PHP
php jquery 实现新闻标签分类与无刷新分页
2009/12/18 PHP
两个开源的Php输出Excel文件类
2010/02/08 PHP
is_uploaded_file函数引发的不能上传文件问题
2013/10/29 PHP
php正则表达式获取内容所有链接
2015/07/24 PHP
jQuery 使用手册(五)
2009/09/23 Javascript
Jquery Ajax.ashx 高效分页实现代码
2009/10/20 Javascript
js文件中调用js的实现方法小结
2009/10/23 Javascript
JavaScript中的View-Model使用介绍
2011/08/11 Javascript
载入jQuery库的最佳方法详细说明及实现代码
2012/12/28 Javascript
jQuery 无限级菜单的简单实例
2014/02/21 Javascript
javascript实现youku的视频代码自适应宽度
2015/05/25 Javascript
JavaScript获取并更改input标签name属性的方法
2015/07/02 Javascript
javascript简单实现类似QQ头像弹出效果的方法
2015/08/03 Javascript
jquery实现点击其他区域时隐藏下拉div和遮罩层的方法
2015/12/23 Javascript
学习javascript面向对象 实例讲解面向对象选项卡
2016/01/04 Javascript
js删除Array数组中指定元素的两种方法
2016/08/03 Javascript
EasyUI学习之Combobox下拉列表(1)
2016/12/29 Javascript
jQuery Validate 相关参数及常用的自定义验证规则
2017/03/06 Javascript
node koa2实现上传图片并且同步上传到七牛云存储
2017/07/31 Javascript
bootstrap treeview 扩展addNode方法动态添加子节点的方法
2017/11/21 Javascript
微信小程序实现聊天对话(文本、图片)功能
2018/07/06 Javascript
详解处理Vue单页面应用SEO的另一种思路
2018/11/09 Javascript
Vue实现背景更换颜色操作
2020/07/17 Javascript
vue 使用微信jssdk,调用微信相册上传图片功能
2020/11/13 Javascript
[02:16]DOTA2超级联赛专访Burning 逆袭需要抓住机会
2013/06/24 DOTA
python pygame模块编写飞机大战
2018/11/20 Python
python用fsolve、leastsq对非线性方程组求解
2018/12/15 Python
python3实现点餐系统
2019/01/24 Python
详解numpy矩阵的创建与数据类型
2019/10/18 Python
如何理解python面向对象编程
2020/06/01 Python
使用tensorflow进行音乐类型的分类
2020/08/14 Python
留学推荐信写作指南
2014/01/25 职场文书
医院岗前培训心得体会
2016/01/08 职场文书
2016年第二十五次全国助残日活动总结
2016/04/01 职场文书