详解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 相关文章推荐
JavaScript中令你抓狂的魔术变量
Nov 30 Javascript
jQuery 使用手册(六)
Sep 23 Javascript
jquery实现图片渐变切换兼容ie6/Chrome/Firefox
Aug 02 Javascript
jQuery+ajax实现鼠标单击修改内容的思路
Jun 29 Javascript
javascript复制粘贴与clipboardData的使用
Oct 16 Javascript
jQuery zTree搜索-关键字查询 递归无限层功能实现代码
Jan 25 jQuery
详解jQuery-each()方法
Mar 13 jQuery
js字符串类型String常用操作实例总结
Jul 05 Javascript
uni-app自定义导航栏按钮|uniapp仿微信顶部导航条功能
Nov 12 Javascript
微信小程序tabBar设置实例解析
Nov 14 Javascript
vue-cli在 history模式下的配置详解
Nov 26 Javascript
js屏蔽F12审查元素,禁止修改页面代码等实现代码
Oct 02 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开启gzip页面压缩实例代码
2010/03/11 PHP
php递归创建和删除文件夹的代码小结
2012/04/13 PHP
php获取当前时间的毫秒数的方法
2014/01/26 PHP
php函数与传递参数实例分析
2014/11/15 PHP
php面向对象的用户登录身份验证
2017/06/08 PHP
PHP实现的基于单向链表解决约瑟夫环问题示例
2017/09/30 PHP
jquery 多行文本框(textarea)高度变化
2013/07/03 Javascript
JS动画效果打开、关闭层的实现方法
2015/05/09 Javascript
angularjs学习笔记之三大模块(modal,controller,view)
2015/09/26 Javascript
浅析ES6的八进制与二进制整数字面量
2016/08/30 Javascript
详解vue-router 2.0 常用基础知识点之router-link
2017/05/10 Javascript
JavaScript html5 canvas实现图片上画超链接
2017/10/20 Javascript
Vue中实现权限控制的方法示例
2019/06/07 Javascript
angular6开发steps步骤条组件
2019/07/04 Javascript
mock.js模拟数据实现前后端分离
2019/07/24 Javascript
解决layui checkbox 提交多个值的问题
2019/09/02 Javascript
js布局实现单选按钮控件
2020/01/17 Javascript
浅谈python中copy和deepcopy中的区别
2017/10/23 Python
值得收藏,Python 开发中的高级技巧
2018/11/23 Python
对python使用telnet实现弱密码登录的方法详解
2019/01/26 Python
Python实现的企业粉丝抽奖功能示例
2019/07/26 Python
pycharm中import呈现灰色原因的解决方法
2020/03/04 Python
Anaconda+Pycharm环境下的PyTorch配置方法
2020/03/13 Python
python使用openpyxl操作excel的方法步骤
2020/05/28 Python
pycharm激活方法到2099年(激活流程)
2020/09/22 Python
matplotlib之pyplot模块之标题(title()和suptitle())
2021/02/22 Python
马来西亚演唱会订票网站:StubHub马来西亚
2018/10/18 全球购物
写好自荐信的几个要点
2013/12/26 职场文书
销售员求职个人的自我评价
2014/02/19 职场文书
升学宴演讲稿
2014/09/01 职场文书
党支部三严三实对照检查材料思想汇报
2014/09/29 职场文书
一年级数学下册复习计划
2015/01/17 职场文书
简历中的自我评价怎么写呢?
2019/04/30 职场文书
SQL Server连接查询的实用教程
2021/04/07 SQL Server
Consul在linux环境的集群部署
2022/04/08 Servers
box-shadow单边阴影的实现
2023/05/21 HTML / CSS