详解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 相关文章推荐
点图片上一页下一页翻页效果
Jul 09 Javascript
js 加载并解析XML字符串的代码
Dec 13 Javascript
script的async属性以非阻塞的模式加载脚本
Jan 15 Javascript
Thinkphp模板没有解析直接原样输出的解决方法
Oct 31 Javascript
Jquery基础教程之DOM操作
Aug 19 Javascript
微信小程序图片选择、上传到服务器、预览(PHP)实现实例
May 11 Javascript
JavaScript中关于class的调用方法
Nov 28 Javascript
Javascript 编码约定(编码规范)
Mar 11 Javascript
Vue 通过自定义指令回顾v-内置指令(小结)
Sep 03 Javascript
React Hooks的深入理解与使用
Nov 12 Javascript
javascript中call()、apply()的区别
Mar 21 Javascript
简单说说如何使用vue-router插件的方法
Apr 08 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
php单件模式结合命令链模式使用说明
2008/09/07 PHP
浅谈apache和nginx的rewrite的区别
2013/02/22 PHP
编辑浪子版表单验证类
2007/05/12 Javascript
《JavaScript高级程序设计》阅读笔记(一) ECMAScript基础
2012/02/27 Javascript
jQuery表单获取和失去焦点输入框提示效果的实例代码
2013/08/01 Javascript
jQuery阻止事件冒泡具体实现
2013/10/11 Javascript
js在指定位置增加节点函数insertBefore()用法实例
2015/01/12 Javascript
jQuery中position()方法用法实例
2015/01/16 Javascript
不定义JQuery插件 不要说会JQuery
2016/03/07 Javascript
浅谈JavaScript中面向对象的的深拷贝和浅拷贝
2016/08/01 Javascript
jquery滚动条插件(可以自定义)
2016/12/11 Javascript
详解如何让Express支持async/await
2017/10/09 Javascript
layui中使用jquery控制radio选中事件的示例代码
2018/08/15 jQuery
微信小程序实现树莓派(raspberry pi)小车控制
2020/02/12 Javascript
JavaScript进阶(一)变量声明提升实例分析
2020/05/09 Javascript
Python使用email模块对邮件进行编码和解码的实例教程
2016/07/01 Python
python中requests使用代理proxies方法介绍
2017/10/25 Python
浅谈python迭代器
2017/11/08 Python
python实现隐马尔科夫模型HMM
2018/03/25 Python
python实现递归查找某个路径下所有文件中的中文字符
2019/08/31 Python
基于Python执行dos命令并获取输出的结果
2019/12/30 Python
Python MySQL 日期时间格式化作为参数的操作
2020/03/02 Python
Opencv+Python识别PCB板图片的步骤
2021/01/07 Python
HTML5是什么 HTML5是什么意思 HTML5简介
2012/10/26 HTML / CSS
日本最大的药妆连锁店:Matsukiyo松本清药妆店
2017/11/23 全球购物
吉列剃须刀英国官网:Gillette英国
2019/03/28 全球购物
基于Python 函数和方法的区别说明
2021/03/24 Python
毕业生求职的求职信
2013/12/05 职场文书
信息技术专业个人自我评价
2013/12/11 职场文书
企业口号大全
2014/06/12 职场文书
公司合作协议范文
2014/10/01 职场文书
2014年镇党建工作汇报材料
2014/11/02 职场文书
锦旗赠语
2015/06/23 职场文书
车间安全生产管理制度
2015/08/06 职场文书
2016年中学植树节活动总结
2016/03/16 职场文书
Mysql数据库按时间点恢复实战记录
2021/06/30 MySQL