详解js类型判断


Posted in Javascript onMay 22, 2018

js类型转换中typeof会将null也识别为object, 而且返回的类型比少,我们用Object.prototype.toString来实现

第一版

function isArray(value){
  return Object.prototype.toString.call(value) === "[object Array]";
}

function isFunction(value){
  return Object.prototype.toString.call(value) === "[object Function]";
}

但是这样写,一个个去判断数组,函数,对象的话很麻烦,比较过程化

第二版

我们想用type(obj)的方式返回对应的类型字符串,因为typeof是小写,所以我们也返回小写的标准

function type(obj){
  // -1 代表截止到倒数一位
  return Object.prototype.toString.call(obj).slice(8,-1).toLowerCase()
}

type([]) // "array"

但是这样每次都需要对判断的类型进行slice和toLowerCase也是比较耗性能的, 而且判断类型只有几种,所以我们可以用对象提前将可能的结果缓存起来

第三版

//将types放外面 而不是放在type函数里面, 利用闭包,优化性能,不用每次判断都声明一次typess
var types = {
  '[object Function]': 'function',
  '[object Number]': 'number',
  ...
}

function type(obj) {
  var str = Object.prototype.toString.call(obj)
  return types[str]
}

当然上面的types我们还可以这样优化

// 参考自jquery源码
var types = {}
当然也可以直接用数组存储
"Boolean Number String Function Array Date RegExp Object Error".split(" ").forEach(function(e,i){
  types [ "[object " + e + "]" ] = e.toLowerCase();
}) ;

判断window对象

利用window对象的window属性等于自身

function isWindow( obj ) {
  // obj !== undefined 是为了防止没传参数的时候后面报错
  // Uncaught TypeError: Cannot read property 'window' of undefined的错误
  
  return obj !== undefined && obj === obj.window;
}

判断是不是dom元素

isElement = function(obj) {
  return !!(obj && obj.nodeType === 1);
}
Javascript 相关文章推荐
科讯商业版中用到的ajax空间与分页函数
Sep 02 Javascript
jquery实现的元素的left增加N像素 鼠标移开会慢慢的移动到原来的位置
Mar 21 Javascript
Javascript 设计模式(二) 闭包
May 26 Javascript
JQuery 返回布尔值Is()条件判断方法代码
May 14 Javascript
JavaScript实现鼠标点击后层展开效果的方法
May 13 Javascript
创建基于Bootstrap的下拉菜单的DropDownList的JQuery插件
Jun 02 Javascript
Angularjs单选改为多选的开发过程及问题解析
Feb 17 Javascript
jQuery使用ajax_动力节点Java学院整理
Jul 05 jQuery
node通过npm写一个cli命令行工具
Oct 12 Javascript
Js 利用正则表达式和replace函数获取string中所有被匹配到的文本(推荐)
Oct 28 Javascript
基于vue2的canvas时钟倒计时组件步骤解析
Nov 05 Javascript
小程序hover-class点击态效果实现
Feb 26 Javascript
vue.js过滤器+ajax实现事件监听及后台php数据交互实例
May 22 #Javascript
swiper 自动图片无限轮播实现代码
May 21 #Javascript
JS动态插入脚本和插入引用外部链接脚本的方法
May 21 #Javascript
通过jquery toggleClass()属性制作文章段落更改背景颜色
May 21 #jQuery
基于Vue的延迟加载插件vue-view-lazy
May 21 #Javascript
jQuery获取随机颜色的实例代码
May 21 #jQuery
JS实现常见的查找、排序、去重算法示例
May 21 #Javascript
You might like
yii通过小物件生成view的方法
2016/10/08 PHP
PHP 配置后台登录以及模板引入
2017/01/24 PHP
Laravel 自带的Auth验证登录方法
2019/09/30 PHP
可以显示单图片,多图片ajax请求的ThickBox3.1类下载
2007/12/23 Javascript
一个JQuery操作Table的代码分享
2012/03/30 Javascript
JS模块与命名空间的介绍
2013/03/22 Javascript
JS鼠标滑过图片时切换图片实现思路
2013/09/12 Javascript
JQuery与Ajax调用新浪API获取短网址的代码
2014/02/07 Javascript
javascript实现动态模态绑定grid过程代码
2014/09/22 Javascript
Javascript BOM学习小结(六)
2015/11/26 Javascript
jQuery动画效果实现图片无缝连续滚动
2016/01/12 Javascript
jQuery+json实现动态创建复杂表格table的方法
2016/10/25 Javascript
Angularjs的Controller间通信机制实例分析
2016/11/07 Javascript
对Angular中单向数据流的深入理解
2018/03/31 Javascript
原生JS实现旋转轮播图+文字内容切换效果【附源码】
2018/09/29 Javascript
新手快速入门微信小程序组件库 iView Weapp
2019/06/24 Javascript
Node中对非阻塞I/O、事件循环的知识点总结
2020/01/05 Javascript
[00:43]DOTA2小紫本全民票选福利PA至宝全方位展示
2014/11/25 DOTA
[01:02:47]EG vs Secret 2019国际邀请赛淘汰赛 胜者组 BO3 第一场 8.21.mp4
2020/07/19 DOTA
python相似模块用例
2016/03/04 Python
Python爬取十篇新闻统计TF-IDF
2018/01/03 Python
解决Python网页爬虫之中文乱码问题
2018/05/11 Python
python opencv实现旋转矩形框裁减功能
2018/07/25 Python
python 通过麦克风录音 生成wav文件的方法
2019/01/09 Python
简单了解python中的与或非运算
2019/09/18 Python
Python jieba库用法及实例解析
2019/11/04 Python
Python 实现try重新执行
2019/12/21 Python
python路径的写法及目录的获取方式
2019/12/26 Python
pyCharm 设置调试输出窗口中文显示方式(字符码转换)
2020/06/09 Python
web页面录屏实现
2019/02/12 HTML / CSS
HTML5拖放效果的实现代码
2016/11/17 HTML / CSS
详解如何解决H5开发使用wx.hideMenuItems无效果不生效
2021/01/20 HTML / CSS
全球500多个机场的接送服务:Suntransfers
2019/06/03 全球购物
XML文档面试题
2015/08/05 面试题
读群众路线的心得体会
2014/09/03 职场文书
python 爬取哔哩哔哩up主信息和投稿视频
2021/06/07 Python