获取对象具体类型的功能函数
HTML5学堂:JavaScript当中,时常会使用到typeof来进行数据类型的检测,但是我们觉得typeof不能够满足我们的需求,对于数组、函数、时间对象等,使用typeof返回的都是“object”,如果我们希望更进一步的检测要怎么办呢?一起来看吧~
toString方法
在JavaScript当中,想要判断一个对象值属于哪种内置对象,最靠谱的方法就是使用toString
先上代码
var str = 'HTML5学堂';
var arr = ['独行冰海', '梦幻雪冰'];
var obj = {editor : '其其'};
var judge = true;
console.log(Object.prototype.toString.call(str));
console.log(Object.prototype.toString.call(arr));
console.log(Object.prototype.toString.call(obj));
console.log(Object.prototype.toString.call(judge));
打印结果
为何要用call方法?为何返回的是[object xxxx],别急,听我慢慢道来~
关于toString
ECMAScript5.0当中,对toString的原理是如此描述的
1 如果传入的对象值为undefined,则返回[object Undefined]
2 如果传入的对象值为null,则返回[object Null]
3 针对传入的对象执行ECMAScript引擎中的方法ToObject。将原始值类型转换成包装类型。
4 获取传入对象的[[Class]]属性值
5 计算出"[object 传入对象的[[Class]]属性值]"
6 返回这个计算结果
[[Class]]是个神马玩意
[[Class]]是一个内部属性,所有的对象都拥有这个属性,它是一个字符串值,表明该对象的类型。
[[Class]]属性在ECMAScript6.0当中,被内部属性[[NativeBrand]]取而代之,该属性的值对应一个标志值,可以用来区分原生对象的类型。
[[NativeBrand]]返回的内容和[[Class]]并不相同。那么我们是不是不能使用toString了呢?
不要紧,虽然[[NativeBrand]]这个内部属性与[[Class]]规则不完全一样,但是toString方法也进行了相应的修改与调整,返回的也依旧是利利下面提到的这几个返回值。
toString的返回值有哪几种
Null; Undefined; String; Number; Boolean; Object
Arguments; Array; Date; Error; Function; JSON; Math; RegExp
简单的总结一下
通过Object.prototype.toString方法能够实现类型的检测
这种方法在调用的时候,首先会将要处理的对象转换为包装类型(而不是值类型) —— 这个操作是内部进行的
之后,再内部调用,找到当前对象的[[Class]]值
返回[object 具体类型];
使用call的主要原因?——当然是改变this的指向了,Object.prototype.toString()当中toString方法是Object的,不是当前要调用的对象的,我们希望针对相应对象调用toString方法,自然要改变this指向了~
利用toString封装的功能函数
呵呵呵,实现类型检测功能,这才是我琢磨toString的目的~!!!
<script>
function checkType(ele) {
return Object.prototype.toString.call(ele).replace(/[[]]/g, '').split(' ')[1].toLowerCase();
}
var arr = ['HTML5学堂', '利利-独行冰海', '堡堡-梦幻雪冰', '其其'];
console.log(checkType(arr));
</script>
本测试返回的结果是"array"~~~吼吼吼,这样,一个检测对象类型的功能函数就封装完毕啦。
HTML5小编-利利&其其 耗时2.5h
本文中的toString方法参考了网络上的相关资料——《紫云飞的博客园》,感谢博主的付出~
- WCF技术剖析之五:利用ASP.NET兼容模式创建支持会话(Session)的WCF服务
- DoubleAnimation方法
- 已经重写,源码和文章请跳转http://www.cnblogs.com/ymnets/p/5621706.html
- 有趣 不用js也能创建silverlight
- Hadoop和Spark的异同
- ASP.NET MVC5+EF6+EasyUI 后台管理系统(62)-EF链接串加密
- sl 2.0 重要更新
- 云计算技术原理
- WCF技术剖析之五:利用ASP.NET兼容模式创建支持会话(Session)的WCF服务
- 进入AI时代,你准备好了吗?
- TiDB 在 G7 的实践和未来
- 投资钛值的你,知道钛链是什么吗?
- Is this a MS EnterLib DAAB BUG or not?
- Silverlight 2 has a Timer (DispatcherTimer)
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- Linux系统——zabbix监控软件安装布署
- 1.4 Installation and Setup(安装和设置)
- Linux系统VIM编辑器常用操作介绍
- 1.6 Navigating This Book(本书导航)
- 2.1 The Python Interpreter(python解释器)
- Linux系统—Centos7安装教程
- 2.2 IPython基础
- Linux系统crond、rsync、打包备份数据操作实战
- 2.3 Python语言基础
- 开发需求
- Linux系统组建SVN服务器
- 面向对象学习
- 常用模块
- 代理错误[WinError 10061]
- Linux系统JDK+Tomcat环境安装布署过程